/* Páginas de cuenta: mismas tarjetas y píldoras de la landing y de la app. */
.acc{max-width:560px;padding-top:28px;padding-bottom:70px;display:grid;gap:16px}
.acc h1{font-size:clamp(2rem,7vw,2.8rem)}
.acc h2{font-size:1.35rem;margin-bottom:8px}
.acc .lead{margin-top:0}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:22px 20px}
label.f{display:block;font-weight:500;margin:0 0 14px}
label.f>span{display:block;margin-bottom:6px}
.acc input[type=email],.acc input[type=password],.acc input[type=text]{width:100%;min-height:48px;padding:10px 14px;border:1.5px solid #CDBFA9;border-radius:14px;background:#fff;font:inherit;color:var(--ink)}
.chk{display:flex;gap:12px;align-items:flex-start;margin:14px 0 4px;line-height:1.4}
.chk input{flex:none;width:24px;height:24px;margin-top:2px;accent-color:var(--ink)}
.chk a{text-decoration:underline;text-underline-offset:3px}
.hint{color:var(--muted);font-size:.95rem;margin:-6px 0 8px}
.status{min-height:0;margin:10px 0 0;font-size:.98rem}
.status:empty{margin:0}
.status.bad{color:#A8261C}.status.ok{color:#1F6B45}.status.warn{color:#7A4A00}
.acc .btn{margin-top:10px}
.acc form .btn.main{width:100%}
.alt{text-align:center;margin-top:6px}
.alt a{text-decoration:underline;text-underline-offset:3px}
.big{font:600 1.5rem var(--serif)}
progress{width:100%;height:10px;border-radius:99px;appearance:none;border:0;background:var(--line);overflow:hidden;margin:10px 0 4px}
progress::-webkit-progress-bar{background:var(--line)}progress::-webkit-progress-value{background:var(--ink);border-radius:99px}progress::-moz-progress-bar{background:var(--ink)}
.actions{display:flex;gap:10px;flex-wrap:wrap}
.lnk{background:none;border:0;padding:8px 2px;min-height:44px;font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer;color:inherit}
.top .lnk{font-weight:500;text-decoration:none}
button.btn:disabled{opacity:.55;cursor:default}

/* cobros */
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.price-cop{margin:2px 0 0}.price-cop+.hint{margin:12px 0 8px}
/* Plan + «Ver los otros planes»: en celular se aplanan (el enlace va después del formulario, como antes); en escritorio forman una columna fija */
.plan-side{display:contents}.plan-side>.alt{order:1}.price-cop b{font:700 2rem var(--serif)}.price-cop span{color:var(--muted)}
.pts{margin:8px 0 0;padding-left:20px;color:var(--muted)}
.acc h3{font-size:1.1rem;margin:20px 0 0}
.hist{list-style:none;margin:8px 0 0;padding:0}
.hist li{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:10px 0;border-top:1px solid var(--line)}
.hist li em{grid-column:1/-1;font-style:normal;font-size:.92rem}
.st.approved{color:#1F6B45}.st.declined,.st.error,.st.voided{color:#A8261C}.st.pending{color:#7A4A00}
#sub-change{margin-top:6px}

.verify-note{background:#fff6e0;border-color:#e9cf8a;color:#5a4300}

/* Escritorio: formularios cortos en dos mitades (título a la izquierda, tarjeta a la derecha); cuenta y suscripción en dos columnas. */
@media(min-width:1000px){
  .acc{padding-top:clamp(36px,4vw,72px);padding-bottom:clamp(70px,7vw,120px)}
  .acc[data-page=registro],.acc[data-page=entrar],.acc[data-page=recuperar],.acc[data-page=restablecer]{max-width:var(--w);grid-template-columns:minmax(0,1fr) minmax(24rem,30rem);grid-template-rows:auto auto auto;column-gap:clamp(48px,7vw,140px);align-content:center;min-height:62vh}
  .acc[data-page=registro]>*,.acc[data-page=entrar]>*,.acc[data-page=recuperar]>*,.acc[data-page=restablecer]>*{grid-column:2}
  .acc[data-page=registro]>h1,.acc[data-page=entrar]>h1,.acc[data-page=recuperar]>h1,.acc[data-page=restablecer]>h1{grid-column:1;grid-row:1;align-self:end;font-size:clamp(3rem,4.4vw,5.2rem);line-height:1.02}
  .acc[data-page=registro]>.lead,.acc[data-page=entrar]>.lead,.acc[data-page=recuperar]>.lead,.acc[data-page=restablecer]>.lead{grid-column:1;grid-row:2;align-self:start;font-size:1.3rem;max-width:22em}
  .acc[data-page=registro]>.card,.acc[data-page=entrar]>.card,.acc[data-page=recuperar]>.card,.acc[data-page=restablecer]>.card{grid-column:2;grid-row:1/span 2;align-self:center;padding:30px 28px}
  .acc[data-page=cuenta],.acc[data-page=suscribirse]{max-width:var(--w);grid-template-columns:repeat(2,minmax(0,1fr));gap:20px clamp(24px,3vw,48px);align-items:start}
  .acc[data-page=cuenta]>h1,.acc[data-page=cuenta]>.actions,.acc[data-page=cuenta]>.small,.acc[data-page=suscribirse]>h1,.acc[data-page=suscribirse]>.verify-note{grid-column:1/-1}
  .acc[data-page=suscribirse]{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
  .acc[data-page=suscribirse]>.plan-side{display:block;position:sticky;top:20px;align-self:start}
  .plan-side>.alt{order:0;margin-top:14px}
  .acc[data-page=cuenta]>h1,.acc[data-page=suscribirse]>h1{font-size:clamp(2.6rem,3.4vw,4rem)}
  .acc[data-page=verificar],.acc[data-page=gracias],.acc[data-page=tarjeta]{max-width:34rem}
}
@media(min-width:1000px){
  .acc[data-page=cuenta]{display:block;column-count:2;column-gap:clamp(24px,3vw,48px)}
  .acc[data-page=cuenta]>*{break-inside:avoid;margin:0 0 20px}
  .acc[data-page=cuenta]>h1,.acc[data-page=cuenta]>.actions,.acc[data-page=cuenta]>.small{column-span:all}
}