/* v234 · assets/css/login-amanecer.css — el login «Amanecer» (acceso, recuperación, sesión cerrada y nueva contraseña;
   views/Login/). PLAN_TECNICO_LOGIN_AMANECER_MENU_TARJETAS_2026-10-21.md §4.A.
   Es el CSS del prototipo (insumos_v234_login_menu_tarjetas\login\login-v6.css) SIN la barra «BOCETO» (.review-*), sin el
   diálogo de información (.dialog*) y sin --bar; sin @font-face (Lexend y Hanken: fuentes-amanecer.css). Imágenes por
   dirección (no data URI). Lo que suma el v234 va AL FINAL, en su bloque. */
/* =========================================================
   ClassPro · Login v6 «Amanecer»
   El acceso con el mismo cielo, montañas y tipografía de la
   landing Propuesta 6. Limpio, calmo y con color suave.
   ========================================================= */
:root{
  --white:#FFFFFF;
  --bg:#F6F8F9;
  --ink:#0B3140;
  --ink-2:#14495D;
  --text:#415D67;
  --muted:#556E76;
  --line:#E2E9EC;
  --line-2:#D3DEE2;
  --brand:#00AEEF;

  --cielo-0:#EAF5FB; --cielo-1:#D3ECF8; --cielo:#0A6F9C;
  --menta-0:#E6F6F0; --menta-1:#CBEEDF; --menta:#13775A;
  --lav-0:#EFECFC;   --lav-1:#DDD6F9;   --lav:#5843C4;
  --dur-0:#FDEEE5;   --dur-1:#F9DAC8;   --dur:#A9522A;
  --arena-0:#FCF4E0; --arena-1:#F6E5B6; --arena:#87590A;
  --rosa-0:#FCEBF0;  --rosa-1:#F7D3DE;  --rosa:#AE3760;

  --f-display:"Lexend","Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-body:"Hanken Grotesk","Lexend",system-ui,-apple-system,"Segoe UI",sans-serif;

  --ease:cubic-bezier(.22,.61,.36,1);
  --slow:cubic-bezier(.33,0,.15,1);
  --spring:cubic-bezier(.34,1.56,.64,1);
  --shadow-soft:0 1px 2px rgba(11,49,64,.04),0 18px 40px -24px rgba(31,70,110,.22);
  --shadow-float:0 1px 2px rgba(11,49,64,.05),0 40px 80px -36px rgba(40,64,120,.32);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;background:var(--white);color:var(--text);font:400 16px/1.6 var(--f-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:clip}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,p{margin:0}
ul{margin:0;padding:0;list-style:none}
strong{font-weight:600;color:var(--ink)}
[hidden]{display:none!important}
.ic{width:20px;height:20px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
:focus-visible{outline:3px solid var(--cielo);outline-offset:3px;border-radius:10px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Tonos ---------- */
.h-cielo{--hue:var(--cielo);--hue-0:var(--cielo-0);--hue-1:var(--cielo-1)}
.h-menta{--hue:var(--menta);--hue-0:var(--menta-0);--hue-1:var(--menta-1)}
.h-lav{--hue:var(--lav);--hue-0:var(--lav-0);--hue-1:var(--lav-1)}
.h-dur{--hue:var(--dur);--hue-0:var(--dur-0);--hue-1:var(--dur-1)}
.h-arena{--hue:var(--arena);--hue-0:var(--arena-0);--hue-1:var(--arena-1)}
.h-rosa{--hue:var(--rosa);--hue-0:var(--rosa-0);--hue-1:var(--rosa-1)}
.tile{--s:44px;width:var(--s);height:var(--s);border-radius:14px;display:grid;place-items:center;flex-shrink:0;background:var(--hue-1,var(--cielo-1));color:var(--hue,var(--cielo))}
.tile .ic{width:21px;height:21px}
.tile.sm{--s:36px;border-radius:11px}
.tile.sm .ic{width:18px;height:18px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:500 14.5px/1.4 var(--f-body);color:var(--hue,var(--cielo))}
.eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.85}
.flag{width:22px;height:14px;border-radius:4px;flex-shrink:0;background:linear-gradient(180deg,#002B7F 0 16.66%,#fff 16.66% 33.33%,#CE1126 33.33% 66.66%,#fff 66.66% 83.33%,#002B7F 83.33%);box-shadow:0 0 0 1px rgba(11,49,64,.08)}

/* ---------- Botones ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 24px;border-radius:999px;font:500 16px/1.2 var(--f-body);text-decoration:none;white-space:nowrap;transition:background-color .35s var(--ease),color .35s var(--ease),box-shadow .35s var(--ease)}
.btn .ic{width:18px;height:18px;transition:transform .35s var(--ease)}
.btn:hover .ic.go{transform:translateX(3px)}
.btn-ink{background:var(--ink);color:#fff}
.btn-ink:hover{background:var(--ink-2)}
.btn-soft{background:var(--white);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn-soft:hover{background:var(--bg)}
.btn-wa{background:var(--menta-0);color:var(--menta);box-shadow:inset 0 0 0 1px var(--menta-1)}
.btn-wa:hover{background:var(--menta-1)}
.btn.block{width:100%}
.link{display:inline-flex;align-items:center;gap:6px;font-weight:500;color:var(--hue,var(--cielo));text-decoration:none;border-radius:8px}
.link .ic{width:16px;height:16px;transition:transform .35s var(--ease)}
.link:hover{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.link:hover .ic{transform:translate(2px,-2px)}
.link.back:hover .ic{transform:translateX(-3px)}
.icon-btn{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;color:var(--menta);background:var(--menta-0);box-shadow:inset 0 0 0 1px var(--menta-1);transition:background-color .3s}
.icon-btn:hover{background:var(--menta-1)}
.icon-btn .ic{width:20px;height:20px}


/* ---------- Estructura ---------- */
.shell{overflow-x:clip;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(452px,.88fr);min-height:100vh;min-height:100dvh}

/* =========================================================
   Panel de marca: el cielo y las montañas de la landing
   ========================================================= */
.story{position:relative;display:flex;flex-direction:column;margin:12px 0 12px 12px;padding:clamp(20px,3vh,34px) clamp(24px,3vw,48px) clamp(12px,2vh,20px);border-radius:32px;overflow:hidden;isolation:isolate;background:linear-gradient(180deg,#FFFFFF 0%,#FBFAFE 30%,#F3F2FC 64%,#EEF5FC 100%);box-shadow:inset 0 0 0 1px rgba(11,49,64,.05)}
.sky{position:absolute;inset:0;z-index:-3;pointer-events:none}
.sky i{position:absolute;border-radius:50%}
.sky .haze{width:760px;height:600px;left:-300px;top:-240px;background:radial-gradient(circle,rgba(214,236,248,.85) 0%,rgba(214,236,248,0) 64%)}
.sky .lilac{width:680px;height:540px;left:14%;top:34%;background:radial-gradient(circle,rgba(226,219,250,.62) 0%,rgba(226,219,250,0) 64%)}
.sky .sun{width:720px;height:720px;right:-230px;top:4%;background:radial-gradient(circle,rgba(250,214,192,.66) 0%,rgba(250,214,192,.24) 38%,rgba(250,214,192,0) 66%)}
.ridges{position:absolute;left:50%;bottom:0;z-index:-2;width:max(1500px,160%);height:clamp(230px,41%,330px);translate:-50% 0;pointer-events:none}
.ridges svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.story::after{content:"";position:absolute;inset:auto 0 0;z-index:-1;height:96px;background:linear-gradient(180deg,rgba(240,250,245,0) 0%,rgba(240,250,245,.9) 100%);pointer-events:none}

.story-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.story-top .logo{margin-top:7px}
.origin{display:flex;flex-direction:column;align-items:flex-end;gap:7px}
.soon{display:inline-flex;align-items:center;gap:7px;padding-right:8px;font:500 13px/1.3 var(--f-body);color:var(--lav);white-space:nowrap}
.soon .ic{width:15px;height:15px;stroke-width:1.8}

.logo{width:188px}
.badge{display:inline-flex;align-items:center;gap:10px;padding:7px 15px 7px 9px;border-radius:999px;background:rgba(255,255,255,.8);box-shadow:inset 0 0 0 1px var(--line);font:500 13.5px/1.35 var(--f-body);color:var(--text);white-space:nowrap}

.story-main{flex:1;display:flex;flex-direction:column;justify-content:center;padding:clamp(12px,2.4vh,28px) 0 clamp(10px,2vh,20px)}
.h1{font:300 clamp(36px,3.6vw,60px)/1.06 var(--f-display);letter-spacing:-.04em;color:var(--ink);text-wrap:balance}
.h1 .ln{display:block}
.h1-words .w{display:inline-block}
.story-body{margin-top:clamp(14px,2.6vh,26px)}
.lead{font-size:17px;line-height:1.66;color:var(--text);max-width:44ch;text-wrap:pretty}
.perks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 28px;max-width:720px;margin-top:clamp(20px,3.4vh,34px)}
.perks li{display:flex;align-items:center;gap:12px;font:500 15px/1.3 var(--f-body);color:var(--ink)}
.perks .tile.sm{--s:34px}
.perks small{display:block;font:400 13px/1.3 var(--f-body);color:var(--muted)}

.backing{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;padding-top:10px;border-top:1px solid rgba(11,49,64,.07)}
.backing-label{font-size:12.5px;color:var(--muted);margin-right:4px}
.backing img{height:36px;width:auto}

/* =========================================================
   Panel de acceso
   ========================================================= */
.access{position:relative;isolation:isolate;display:flex;flex-direction:column;min-width:0;padding:14px clamp(24px,4.2vw,72px) 12px}
.access::before{content:"";position:absolute;z-index:-1;right:-200px;top:-220px;width:620px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(214,236,248,.55) 0%,rgba(214,236,248,0) 64%);pointer-events:none}
.access-top{display:flex;align-items:center;justify-content:flex-end;gap:12px;font-size:14px;color:var(--muted)}
.access-top .m-logo{display:none;margin-right:auto}
.pill-link{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 15px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink);font:500 14px/1 var(--f-body);text-decoration:none;white-space:nowrap;transition:background-color .3s}
.pill-link:hover{background:var(--bg)}
.pill-link .ic{width:15px;height:15px;transition:transform .35s var(--ease)}
.pill-link:hover .ic{transform:translate(2px,-2px)}
.access-main{flex:1;display:flex;align-items:center;justify-content:center;padding:clamp(10px,2vh,24px) 0}
.panel{width:min(440px,100%)}
.panel:focus{outline:none}
.panel h2:first-child{margin-top:0}
.panel h2{margin-top:10px;font:300 clamp(28px,2.15vw,33px)/1.12 var(--f-display);letter-spacing:-.035em;color:var(--ink);text-wrap:balance}
.subtitle{margin-top:8px;font-size:16px;line-height:1.6;color:var(--text);text-wrap:pretty}

.form{display:grid;gap:12px;margin-top:20px}
.field-label{display:block;margin-bottom:7px;font:500 14px/1.3 var(--f-body);color:var(--ink)}
.input-wrap{position:relative;display:flex;align-items:center}
.input-wrap>.ic{position:absolute;left:16px;width:19px;height:19px;color:#7E959C;pointer-events:none;transition:color .3s}
.input-wrap input{width:100%;height:50px;padding:0 50px 0 46px;border:0;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line-2);font:400 16px/1 var(--f-body);color:var(--ink);transition:box-shadow .3s var(--ease),background-color .3s}
.input-wrap input::placeholder{color:#8A9EA4;opacity:1}
.input-wrap input:hover{box-shadow:inset 0 0 0 1px #B9C9CE}
.input-wrap input:focus{outline:none;box-shadow:inset 0 0 0 1px var(--brand),0 0 0 4px rgba(0,174,239,.16)}
.input-wrap:focus-within>.ic{color:var(--cielo)}
.valid-ico{position:absolute;right:14px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--menta-0);color:var(--menta);opacity:0;transform:scale(.5);transition:opacity .3s,transform .45s var(--spring);pointer-events:none}
.valid-ico .ic{width:14px;height:14px;stroke-width:2.6}
.input-wrap input:valid:not(:placeholder-shown)~.valid-ico{opacity:1;transform:none}
.reveal{position:absolute;right:6px;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;color:#7E959C;transition:background-color .3s,color .3s}
.reveal:hover{background:var(--bg);color:var(--ink)}
.reveal .ic{width:19px;height:19px}

.options{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;font-size:14.5px}
.check{position:relative;display:inline-flex;align-items:center;gap:10px;cursor:pointer;color:var(--text)}
.check input{position:absolute;opacity:0;width:1px;height:1px}
.box{display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line-2);transition:background-color .25s,box-shadow .25s}
.box svg{width:14px;height:14px;fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:16;stroke-dashoffset:16;transition:stroke-dashoffset .3s var(--ease)}
.check:hover .box{box-shadow:inset 0 0 0 1.5px #B9C9CE}
.check input:checked+.box{background:var(--ink);box-shadow:none}
.check input:checked+.box svg{stroke-dashoffset:0}
.check input:focus-visible+.box{outline:3px solid var(--cielo);outline-offset:2px}

.primary{margin-top:4px}
.primary .spinner{display:none;width:18px;height:18px;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .8s linear infinite}
.primary.is-loading{pointer-events:none;background:var(--ink-2)}
.primary.is-loading .ic{display:none}
.primary.is-loading .spinner{display:block}
@keyframes spin{to{transform:rotate(360deg)}}

.status{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:14px;background:var(--menta-0);box-shadow:inset 0 0 0 1px var(--menta-1);color:var(--menta);font-size:14px;line-height:1.5}
.status .ic{width:18px;height:18px;margin-top:1px;stroke-width:2}
.mo .status:not([hidden]){animation:rise-s .5s var(--slow)}


.register{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 10px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line);font-size:15px;color:var(--text)}


.back-row{margin-top:20px;text-align:center}
.tip{display:flex;gap:12px;align-items:flex-start;margin-top:18px;padding:14px;border-radius:18px;background:var(--lav-0);box-shadow:inset 0 0 0 1px var(--lav-1);font-size:14px;line-height:1.5;color:var(--text)}
.tip .ic{width:18px;height:18px;margin-top:2px;color:var(--lav)}
.tip a{color:var(--lav);font-weight:600}

/* Sesión cerrada */
.seal{position:relative;display:grid;place-items:center;width:72px;height:72px;margin-top:22px;border-radius:50%;background:linear-gradient(140deg,#4FD3A4,#13926B);color:#fff;box-shadow:0 0 0 8px var(--menta-0),0 18px 36px -12px rgba(19,119,90,.55)}
.seal .ic{width:34px;height:34px;stroke-width:2.6}
.seal::after{content:"";position:absolute;inset:-8px;border-radius:50%;border:3px solid #7FD3B2;opacity:0}
.saved{display:flex;align-items:center;gap:14px;margin-top:22px;padding:14px;border-radius:20px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),var(--shadow-soft)}
.saved strong{display:block;font:500 15px/1.3 var(--f-display);letter-spacing:-.01em}
.saved p{font-size:13.5px;line-height:1.45;color:var(--muted)}
.logout-actions{display:grid;gap:12px;margin-top:22px;justify-items:center}

.access-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;font-size:13px;color:var(--muted)}
.access-footer nav{display:flex;gap:18px}
.access-footer button{color:var(--muted);transition:color .3s;border-radius:6px}
.access-footer button:hover{color:var(--ink)}
.access-footer a{color:var(--muted);text-decoration:none;border-radius:6px;transition:color .3s}
.access-footer a:hover{color:var(--ink)}

@keyframes dlg-in{from{opacity:0;transform:translateY(14px) scale(.985)}}

/* =========================================================
   Movimiento (solo con .mo: se quita si el sistema pide
   reducir movimiento o si no hay JavaScript)
   ========================================================= */
@keyframes rise-s{from{opacity:0;transform:translateY(14px)}}
@keyframes draw{from{stroke-dasharray:110;stroke-dashoffset:110}to{stroke-dasharray:110;stroke-dashoffset:0}}
@keyframes word-in{to{opacity:1;filter:blur(0);transform:none}}
@keyframes ridge-up{from{translate:0 90px;opacity:0}}
@keyframes ridge-flow{to{transform:translateX(-3200px)}}
@keyframes sun-rise{from{opacity:0;translate:0 200px;scale:.6}}
@keyframes safe-in{0%{opacity:0;transform:scale(.2) rotate(-40deg)}60%{opacity:1;transform:scale(1.12) rotate(6deg)}100%{transform:none}}
@keyframes safe-ring{0%{opacity:.9;transform:scale(.9)}100%{opacity:0;transform:scale(1.6)}}

.mo [data-in]{animation:rise-s 1.1s var(--slow) backwards;animation-delay:var(--d,0s)}
.mo .h1-words .w{opacity:0;filter:blur(10px);transform:translateY(.32em);animation:word-in 1.2s var(--slow) forwards;animation-delay:calc(.15s + var(--i) * .07s)}
.mo .ridges .far{animation:ridge-up 2s var(--slow) .35s both}
.mo .ridges .mid{animation:ridge-up 2s var(--slow) .55s both}
.mo .ridges .near{animation:ridge-up 2s var(--slow) .75s both}
/* Las montañas avanzan sin pausa de derecha a izquierda; las del fondo, más lento (profundidad) */
.mo .ridges .flow{animation:ridge-flow linear infinite}
.mo .ridges .far .flow{animation-duration:132s}
.mo .ridges .mid .flow{animation-duration:94s}
.mo .ridges .near .flow{animation-duration:66s}
.mo .sky .sun{animation:sun-rise 2.8s var(--slow) both}


.mo .panel:not([hidden]) .rv{animation:rise-s .7s var(--slow) backwards;animation-delay:var(--d,0s)}
.mo #logout-panel:not([hidden]) .seal{animation:safe-in .9s var(--spring) .15s backwards}
.mo #logout-panel:not([hidden]) .seal .ic{animation:draw 1s var(--slow) .4s backwards}
.mo #logout-panel:not([hidden]) .seal::after{animation:safe-ring 2.6s ease-out .9s infinite}

/* =========================================================
   Pantallas medianas y celular
   ========================================================= */
@media (max-width:1400px) and (min-width:980px){
  .shell{grid-template-columns:minmax(0,1.2fr) minmax(420px,.8fr)}
  .access{padding-inline:clamp(24px,3vw,48px)}
}
@media (max-width:1180px) and (min-width:980px){
  .perks{grid-template-columns:1fr;gap:10px}
}
@media (max-height:700px) and (min-width:980px){
  .perks small{display:none}
}
@media (max-width:979px){
  .shell{display:block}
  .story{margin:10px;padding:20px 20px 0;border-radius:26px;min-height:0}
  .story-main{padding:22px 0 124px}
  .story .h1{font-size:clamp(30px,7.4vw,44px)}
  .story-body,.backing{display:none}
  .ridges{height:130px;width:max(calc(100% + 60px),640px)}
  .story::after{height:60px}
  .access{padding:8px 20px 20px}
  .access::before{display:none}
  .access-top{justify-content:center;flex-wrap:wrap}
  .access-main{padding:22px 0 30px}
  .panel{width:min(440px,100%)}
  .access-footer{justify-content:center;text-align:center}
}
@media (max-width:520px){
  .story-top{flex-direction:column;gap:14px}
  .story-top .logo{margin-top:0}
  .origin{align-items:flex-start}
  .soon{padding:0 0 0 8px;font-size:12.5px}
  .badge{padding:6px 12px 6px 8px;font-size:12.5px}
  .logo{width:162px}
}
@media (max-width:400px){
  .options{font-size:13.5px}
  .check{gap:8px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* =========================================================
   v234 · lo que suma la versión integrada (no estaba en el prototipo)
   ========================================================= */
/* Avisos de error (acceso: ?err=; recuperación: estados 2-5) en el mismo lugar que el aviso bueno, en rosa. */
.status.is-error{background:var(--rosa-0);box-shadow:inset 0 0 0 1px var(--rosa-1);color:var(--rosa)}
.status.is-info{background:var(--cielo-0);box-shadow:inset 0 0 0 1px var(--cielo-1);color:var(--cielo)}
/* P2: sin «Mantener la sesión», el enlace queda solo, a la derecha. */
.options.solo{justify-content:flex-end}
/* Nueva contraseña (P4): los mismos ids y el mismo JS de siempre (changePassword.js, que usa clases de Bootstrap). */
.d-none{display:none!important}
.pass-help{margin-top:6px;font-size:13px;color:var(--muted)}
#message{padding:12px 14px;border-radius:14px;background:var(--rosa-0);box-shadow:inset 0 0 0 1px var(--rosa-1);color:var(--rosa);font-size:14px;line-height:1.5}
#message li{margin-left:18px;list-style:disc}
#messageSuccess{margin-top:20px;padding:12px 14px;border-radius:14px;background:var(--menta-0);box-shadow:inset 0 0 0 1px var(--menta-1);color:var(--menta);font-size:14px;line-height:1.5}
.primary:disabled{opacity:.55;cursor:not-allowed}


/* =========================================================
   v242 · «Crear cuenta» en tres pasos y la pantalla de planes, con la línea LIMPIA del prototipo aprobado
   (CLASSPRO\Prototipo_Registro_Dos_Pasos_2026-10-24.html, vuelta 5; PLAN_TECNICO_v242_REGISTRO_SIN_CEDULA_2026-10-24.md
   §3.1 y §3.6). Reemplaza el bloque del v240. Todo acotado a body.cp-registro, que llevan views/Login/register.php,
   views/Subscriptions/plans.php (+ registro-planes.css) y views/Login/verificarCorreo.php: el login, la recuperación, la
   sesión cerrada y la nueva contraseña no cambian. Sin el panel del cielo, sin rectángulo: el registro centrado sobre un
   fondo claro con tres resplandores (cielo, lavanda, durazno). Solo de día, como el login.
   ========================================================= */
body.cp-registro .shell{display:block;min-height:100vh;min-height:100dvh}
body.cp-registro .access{min-height:100vh;min-height:100dvh;padding:20px clamp(20px,4vw,48px) 16px;background:linear-gradient(180deg,#FFFFFF 0%,#FAFBFE 55%,#F3F7FC 100%)}
body.cp-registro .access::before{content:"";display:block;position:fixed;z-index:-1;inset:0;width:auto;height:auto;border-radius:0;background:radial-gradient(640px 480px at 88% -6%,rgba(214,236,248,.7),transparent 70%),radial-gradient(620px 480px at 4% 104%,rgba(226,219,250,.5),transparent 70%),radial-gradient(520px 420px at 100% 100%,rgba(250,214,192,.32),transparent 70%);pointer-events:none}
body.cp-registro .access-top,body.cp-registro .access-footer{width:100%;max-width:1120px;margin:0 auto}
body.cp-registro .access-top{justify-content:flex-start;flex-wrap:nowrap}
body.cp-registro .access-top .espacio{flex:1}
body.cp-registro .marca{display:inline-flex;border-radius:10px}
body.cp-registro .marca img{width:168px;height:auto}
body.cp-registro .access-main{padding:clamp(18px,4vh,48px) 0}
body.cp-registro .access-main .panel{width:min(480px,100%);padding:8px 0;border-radius:0;background:transparent;box-shadow:none}
.mo body.cp-registro .access-main .panel:not([hidden]){animation:rise-s .6s var(--slow) backwards}
body.cp-registro .form{gap:12px}

/* Paso N de 3 */
.cp-registro .pasos{display:flex;align-items:center;gap:12px;margin-bottom:16px;font:500 13.5px/1 var(--f-body);color:var(--muted)}
.cp-registro .pasos .barras{display:flex;gap:6px}
.cp-registro .pasos .barras i{width:34px;height:6px;border-radius:999px;background:var(--line);transition:background-color .5s var(--ease)}
.cp-registro .pasos .barras i.on{background:linear-gradient(90deg,#4FC3F0,var(--cielo))}
.cp-registro .pasos.centrado{justify-content:center}
.cp-registro #paso-nombre .pasos{justify-content:flex-end}
.cp-registro .volver{display:inline-flex;align-items:center;gap:6px;height:32px;margin-right:auto;padding:0 12px 0 8px;border-radius:999px;color:var(--ink);font:500 14px/1 var(--f-body);box-shadow:inset 0 0 0 1px var(--line-2);background:#fff;transition:background-color .3s}
.cp-registro .volver:hover{background:var(--bg)}
.cp-registro .volver .ic{width:16px;height:16px;transition:transform .35s var(--ease)}
.cp-registro .volver:hover .ic{transform:translateX(-3px)}

/* Lo que la contraseña tiene que llevar, en píldoras (los mismos 4 requisitos que exige el servidor; sin símbolo, P3) */
.cp-registro .reqs{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.cp-registro .reqs li{display:inline-flex;align-items:center;gap:5px;height:27px;padding:0 10px 0 8px;border-radius:999px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line);font-size:12.5px;color:var(--muted);transition:background-color .3s,color .3s,box-shadow .3s}
.cp-registro .reqs li .ic{width:13px;height:13px;stroke-width:2.6;opacity:.3;transition:opacity .3s}
.cp-registro .reqs li.ok{background:var(--menta-0);box-shadow:inset 0 0 0 1px var(--menta-1);color:var(--menta)}
.cp-registro .reqs li.ok .ic{opacity:1}
.cp-registro .reqs.marcar li:not(.ok){background:var(--rosa-0);box-shadow:inset 0 0 0 1px var(--rosa-1);color:var(--rosa)}

/* La casilla de los términos y la privacidad, los avisos bajo cada campo y el campo con error */
.cp-registro .terminos{align-items:flex-start;font-size:14.5px;line-height:1.45}
.cp-registro .terminos .box{margin-top:1px;flex:none}
.cp-registro .terminos .link{display:inline}
.cp-registro .msg{margin-top:6px;font-size:13.5px;line-height:1.45;color:var(--rosa)}
.cp-registro .msg .link{--hue:var(--rosa);display:inline;text-decoration:underline;text-underline-offset:3px}
.cp-registro .field.is-error .input-wrap input{box-shadow:inset 0 0 0 1px var(--rosa),0 0 0 4px rgba(174,55,96,.10)}
.cp-registro .field.is-error .input-wrap>.ic{color:var(--rosa)}
.cp-registro .field.is-error .valid-ico{display:none}
.cp-registro .field.is-error .box{box-shadow:inset 0 0 0 1.5px var(--rosa)}
.cp-registro .input-wrap.sin-ic input{padding-left:16px;padding-right:16px}
.cp-registro #campo-pass2 .valid-ico{opacity:0;transform:scale(.5)}
.cp-registro #campo-pass2.coincide .valid-ico{opacity:1;transform:none}
.cp-registro .fila-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cp-registro .field{min-width:0}
.cp-registro .status{margin-top:4px}
.cp-registro .register .link{gap:4px}

/* «Listo» (después de elegir el plan, en plans.php) y la confirmación del correo (verificarCorreo.php) */
.cp-registro #paso-listo h2,.cp-registro .panel-correo h2{margin-top:22px}
.cp-registro .abriendo{display:flex;align-items:center;gap:12px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line);font-size:15px;color:var(--ink)}
.cp-registro .abriendo .spin{width:18px;height:18px;border-radius:50%;border:2px solid var(--cielo-1);border-top-color:var(--cielo);animation:spin .8s linear infinite}
.mo .cp-registro #paso-listo:not([hidden]) .seal,.mo .cp-registro .panel-correo .seal{animation:safe-in .9s var(--spring) .15s backwards}
.mo .cp-registro #paso-listo:not([hidden]) .seal::after,.mo .cp-registro .panel-correo .seal::after{animation:safe-ring 2.6s ease-out .9s infinite}
.cp-registro .seal.no{background:linear-gradient(140deg,#F2A66F,#C8693A);box-shadow:0 0 0 8px var(--dur-0),0 18px 36px -12px rgba(169,82,42,.45)}
.cp-registro .seal.no::after{border-color:#F2BE98}
.cp-registro .acciones{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}

@media (max-width:979px){
  body.cp-registro .access{padding:14px 16px 16px}
  body.cp-registro .access::before{display:block}
  body.cp-registro .access-top{justify-content:flex-start;flex-wrap:nowrap}
  body.cp-registro .access-main{padding:22px 0 30px}
}
@media (max-width:560px){
  body.cp-registro .access-top>span:not(.marca):not(.espacio){display:none}
  body.cp-registro .marca img{width:142px}
  body.cp-registro .access-main .panel{padding:4px 0}
}
@media (max-width:420px){.cp-registro .fila-2{grid-template-columns:1fr}}

/* ---------- Los diálogos de los Términos (v240, P12) y de la Política de privacidad (v242, G1) ---------- */
.dlg-terminos{width:min(760px,calc(100vw - 32px));max-height:min(88vh,900px);padding:0;border:0;border-radius:24px;background:#fff;color:var(--text);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-float);overflow:hidden}
.dlg-terminos[open]{display:flex;flex-direction:column}
.mo .dlg-terminos[open]{animation:dlg-in .35s var(--slow)}
.dlg-terminos::backdrop{background:rgba(11,49,64,.42);backdrop-filter:blur(3px)}
.dlg-cab{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:22px 24px 16px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#FBFAFE,#fff)}
.dlg-cab .eyebrow{font-size:13px}
.dlg-cab h2{margin-top:6px;font:300 26px/1.15 var(--f-display);letter-spacing:-.03em;color:var(--ink)}
.dlg-fecha{margin-top:6px;font-size:13px;color:var(--muted)}
.dlg-x{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;flex:none;color:var(--ink);background:#fff;box-shadow:inset 0 0 0 1px var(--line-2);transition:background-color .3s}
.dlg-x:hover{background:var(--bg)}
.dlg-cuerpo{flex:1;min-height:0;overflow-y:auto;padding:4px 24px 20px;overscroll-behavior:contain}
.dlg-cuerpo:focus-visible{outline-offset:-3px}
.dlg-pie{display:flex;justify-content:flex-end;padding:14px 24px;border-top:1px solid var(--line);background:#fff}
.dlg-pie .btn{min-height:46px}
/* El texto: los mismos estilos de la página pública (assets/css/paginas-publicas.css), acotados al diálogo. */
.dlg-terminos .toc{display:none}
.dlg-terminos article{min-width:0;font-size:15px;line-height:1.65}
.dlg-terminos article section{padding:22px 0;border-top:1px solid var(--line)}
.dlg-terminos article section:first-child{border-top:0;padding-top:16px}
.dlg-terminos article h2{font:400 20px/1.3 var(--f-display);letter-spacing:-.02em;color:var(--ink);margin-bottom:10px}
.dlg-terminos article p+p,.dlg-terminos article p+ul,.dlg-terminos article ul+p,.dlg-terminos article .dos+p,.dlg-terminos article p+.dos,.dlg-terminos article .derechos+p,.dlg-terminos article p+.derechos{margin-top:10px}
.dlg-terminos article strong{color:var(--ink);font-weight:600}
.dlg-terminos article a{color:var(--cielo);font-weight:500}
.dlg-terminos .defs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0}
.dlg-terminos .def{padding:14px 16px;border-radius:16px;background:var(--bg)}
.dlg-terminos .defs dt{font:500 15px/1.3 var(--f-display);color:var(--ink);margin-bottom:4px}
.dlg-terminos .defs dd{margin:0;font-size:14.5px;line-height:1.6}
.dlg-terminos .dos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}
.dlg-terminos .caja{padding:16px 18px;border-radius:18px;background:var(--hue-0);box-shadow:inset 0 0 0 1px var(--hue-1)}
.dlg-terminos .caja h3{display:flex;align-items:center;gap:8px;font:500 15px/1.35 var(--f-display);color:var(--ink);margin-bottom:8px}
.dlg-terminos .caja h3::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--hue)}
.dlg-terminos .caja ul{display:grid;gap:8px}
.dlg-terminos .caja li,.dlg-terminos .lista li{position:relative;padding-left:24px;font-size:14.5px;line-height:1.6}
.dlg-terminos .caja li::before,.dlg-terminos .lista li::before{content:"";position:absolute;left:2px;top:.5em;width:14px;height:14px;border-radius:50%;background:var(--hue-1,var(--cielo-1)) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b3140' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/9px no-repeat}
.dlg-terminos .lista{display:grid;gap:8px;margin-top:10px}
.dlg-terminos .derechos{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.dlg-terminos .tag{display:inline-flex;align-items:center;height:30px;padding:0 13px;border-radius:999px;background:var(--hue-0);box-shadow:inset 0 0 0 1px var(--hue-1);color:var(--hue);font:500 13.5px/1 var(--f-body)}
.dlg-terminos .cierre{margin-top:6px;padding:18px 20px;border-radius:18px;background:linear-gradient(135deg,var(--cielo-0),var(--lav-0));color:var(--ink);font:400 16px/1.6 var(--f-display);letter-spacing:-.01em}
@media (max-width:560px){
  .dlg-terminos{width:100vw;max-width:100vw;max-height:92vh;margin:auto 0 0;border-radius:24px 24px 0 0}
  .dlg-cab{padding:18px 18px 12px}
  .dlg-cab h2{font-size:22px}
  .dlg-cuerpo{padding:2px 18px 16px}
  .dlg-pie{padding:12px 18px}
  .dlg-pie .btn{width:100%}
  .dlg-terminos .defs,.dlg-terminos .dos{grid-template-columns:minmax(0,1fr)}
}

/* v244 (H1) — el campo invisible del registro: fuera de la pantalla, sin display:none (muchos bots lo saltan). */
.cp-trampa{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
