/* Entrada v5 · generado desde docs/boceto/entrada-v5.html (aceptado el 4 oct 2026); lo que no estaba en el boceto va al final. */
@font-face { font-family: "Public Sans"; src: url("fonts/PublicSans-Regular.a0d45ec6cee2.woff2") format("woff2"); font-weight: 400; }
@font-face { font-family: "Public Sans"; src: url("fonts/PublicSans-Medium.38b89f627846.woff2") format("woff2"); font-weight: 500; }
@font-face { font-family: "Public Sans"; src: url("fonts/PublicSans-SemiBold.2fe33dfe398c.woff2") format("woff2"); font-weight: 600; }
@font-face { font-family: "Public Sans"; src: url("fonts/PublicSans-Bold.fe554289d33b.woff2") format("woff2"); font-weight: 700; }

/* ===== Entrada v5 · mismos tokens que el lector v5 ===== */
:root {
  --fondo: #F5F7F5; --sup: #FFFFFF; --sup-2: #FAFBFA;
  --linea: #E3E8E5; --linea-2: #EDF0EE;
  --tinta: #16201E; --tinta-2: #55615D; --tinta-3: #8B9692;
  --pet: #0F5C5A; --pet-o: #0B4644; --pet-s: #E6F1EE; --pet-ss: #F2F8F6;
  --menta: #D8E9E3; --verde: #63CB6A; --turq: #19A4A1;
  --ocre: #A9701C; --ocre-s: #F8EFE0; --ladrillo: #B34A43; --ladrillo-s: #F9EBEA;
  --r: 14px; --r-c: 10px;
  --sombra-1: 0 1px 2px rgba(22,32,30,.05);
  --sombra-3: 0 2px 4px rgba(22,32,30,.04), 0 18px 40px -16px rgba(22,32,30,.24);
  --e: cubic-bezier(.23,1,.32,1);
  --f: "Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body { font-family: var(--f); color: var(--tinta); background: var(--fondo); -webkit-font-smoothing: antialiased; font-size: 14.5px; line-height: 1.5; }
button, input { font: inherit; color: inherit; }
a { color: var(--pet); }
svg.i { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
:focus-visible { outline: 2px solid var(--pet); outline-offset: 2px; border-radius: 6px; }

/* ---------- Doble panel (ingresar y crear cuenta) ---------- */
.entrada { display: grid; grid-template-columns: minmax(0, 46fr) minmax(0, 54fr); min-height: 100vh; }
.vitrina { position: relative; overflow: hidden; display: flex; flex-direction: column; padding: 36px 44px 32px; color: #E7EEEB;
  background: radial-gradient(60% 50% at 85% 10%, rgba(25,164,161,.22), transparent 70%), radial-gradient(50% 45% at 0% 100%, rgba(99,203,106,.16), transparent 70%), #121A18; }
.vitrina::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255,255,255,.07) 1px, transparent 1px); background-size: 22px 22px; mask-image: linear-gradient(180deg, #000 0%, transparent 85%); pointer-events: none; }
.vitrina > * { position: relative; }
.vitrina .logo img { height: 30px; display: block; }
.vitrina .centro-v { margin: auto 0; padding: 40px 0 24px; max-width: 520px; }
.vitrina .ceja { color: var(--verde); }
.vitrina h2 { margin: 0; font-size: 32px; line-height: 1.15; letter-spacing: -.025em; font-weight: 700; color: #fff; }
.vitrina h2 em { font-style: normal; background: linear-gradient(90deg, #7FE3B0, var(--verde)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.vitrina .bajada { margin: 12px 0 0; color: #A9B8B3; font-size: 15px; max-width: 440px; }
.pila { position: relative; height: 282px; margin: 34px 0 6px; }
.mini { position: absolute; background: #fff; color: var(--tinta); border-radius: 14px; box-shadow: 0 30px 60px -24px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.06); }
.mini.a { left: 0; right: 70px; top: 0; padding: 18px 20px; animation: flota 7s ease-in-out infinite; z-index: 2; }
.mini.b { left: 46px; right: 0; top: 150px; padding: 8px 6px; animation: flota 7s ease-in-out -3.5s infinite; opacity: .97; }
@keyframes flota { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
.mini .l1 { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--tinta-3); font-weight: 500; }
.mini h4 { margin: 8px 0 12px; font-size: 15px; line-height: 1.35; letter-spacing: -.01em; }
.mini .bt { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 12px; border-radius: 8px; background: var(--pet); color: #fff; font-size: 12px; font-weight: 600; }
.mini .fila-m { display: flex; align-items: center; gap: 10px; padding: 8px 12px; font-size: 12px; border-bottom: 1px solid var(--linea-2); }
.mini .fila-m:last-child { border-bottom: 0; }
.mini .fila-m span:nth-child(2) { flex: 1; color: var(--tinta-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mini .fila-m .fe { color: var(--tinta-3); }
.pt-v { width: 7px; height: 7px; border-radius: 50%; background: var(--verde); box-shadow: 0 0 0 3px rgba(99,203,106,.2); flex-shrink: 0; }
.chip-bol { display: inline-flex; align-items: center; gap: 5px; height: 21px; padding: 0 8px 0 7px; border-radius: 6px; background: var(--s); color: var(--c); font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.chip-bol::before { content: ""; width: 5px; height: 5px; border-radius: 2px; background: currentColor; }
.pruebas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 26px; }
.pruebas div { display: grid; align-content: start; gap: 6px; font-size: 13px; color: #A9B8B3; }
.pruebas svg { color: var(--verde); width: 20px; height: 20px; }
.pruebas b { color: #fff; font-weight: 600; font-size: 13.5px; }
.vitrina .pie { font-size: 12px; color: #7F8E89; }
.vitrina .etq-v { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 11px; border-radius: 999px; background: rgba(99,203,106,.14); color: #8EE096; font-size: 12.5px; font-weight: 600; margin-bottom: 14px; }
.lista-v { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 12px; }
.lista-v li { display: flex; gap: 12px; align-items: flex-start; color: #C9D6D1; }
.lista-v li span.ic { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; background: rgba(255,255,255,.06); color: var(--verde); flex-shrink: 0; }
.lista-v li span.ic svg { width: 16px; height: 16px; }
.lista-v b { display: block; color: #fff; font-weight: 600; }

.lado-form { display: flex; flex-direction: column; padding: 28px 44px; background: var(--fondo); }
.arriba { display: flex; justify-content: flex-end; align-items: center; gap: 10px; font-size: 13.5px; color: var(--tinta-2); min-height: 36px; }
.logo-m { display: none; margin-right: auto; }
.logo-m img { height: 24px; display: block; }
.form-c { width: 100%; max-width: 400px; margin: auto; padding: 32px 0; }
.ceja { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--pet); margin-bottom: 10px; }
.h1 { font-size: 30px; line-height: 1.15; font-weight: 700; letter-spacing: -.025em; margin: 0; }
.sub { color: var(--tinta-2); margin: 8px 0 0; font-size: 15px; }
.entra > * { animation: entra .5s var(--e) both; }
.entra > *:nth-child(2) { animation-delay: .04s; } .entra > *:nth-child(3) { animation-delay: .08s; } .entra > *:nth-child(4) { animation-delay: .12s; } .entra > *:nth-child(5) { animation-delay: .16s; } .entra > *:nth-child(6) { animation-delay: .2s; }
@keyframes entra { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

form.f { margin-top: 26px; display: grid; gap: 16px; }
.campo label, .campo .etq-c { display: flex; justify-content: space-between; align-items: baseline; font-size: 13.5px; font-weight: 600; margin-bottom: 7px; }
.campo label a, .campo .etq-c a { font-weight: 500; font-size: 13px; text-decoration: none; }
.campo label a:hover { text-decoration: underline; }
.ctl { position: relative; }
.ctl > svg.i { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--tinta-3); width: 17px; height: 17px; pointer-events: none; transition: color .2s; }
.ctl input { width: 100%; height: 46px; padding: 0 14px 0 40px; border: 1px solid var(--linea); border-radius: 11px; background: var(--sup); outline: none; font-size: 15px; transition: border-color .2s var(--e), box-shadow .2s var(--e); }
.ctl input::placeholder { color: #A7B1AD; }
.ctl input:hover { border-color: #CFD7D3; }
.ctl input:focus { border-color: var(--pet); box-shadow: 0 0 0 4px rgba(15,92,90,.1); }
.ctl:focus-within > svg.i { color: var(--pet); }
.ctl input:-webkit-autofill { -webkit-box-shadow: 0 0 0 40px #fff inset; }
.ojo { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; border: 0; border-radius: 8px; background: none; color: var(--tinta-3); display: grid; place-items: center; cursor: pointer; transition: background .15s, color .15s; }
.ojo:hover { background: #F0F3F1; color: var(--tinta); }
.ojo .no { display: none; } .ojo[aria-pressed="true"] .si { display: none; } .ojo[aria-pressed="true"] .no { display: block; }
.ctl.con-ojo input { padding-right: 46px; }
.campo.error input { border-color: var(--ladrillo); box-shadow: 0 0 0 4px rgba(179,74,67,.1); }
.campo .msg-error { display: flex; gap: 6px; align-items: center; margin-top: 7px; font-size: 13px; font-weight: 500; color: var(--ladrillo); }
.campo .msg-error svg { width: 15px; height: 15px; }
.campo .ayuda { margin-top: 7px; font-size: 12.5px; color: var(--tinta-3); }
.fila-f { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 13.5px; }
.check { display: inline-flex; align-items: center; gap: 9px; cursor: pointer; color: var(--tinta-2); user-select: none; }
.check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.check .marca-c { width: 18px; height: 18px; border-radius: 5px; border: 1.5px solid #C5CEC9; display: grid; place-items: center; background: #fff; transition: background .15s, border-color .15s; }
.check .marca-c svg { width: 12px; height: 12px; stroke-width: 3; color: #fff; opacity: 0; transform: scale(.6); transition: opacity .15s, transform .2s var(--e); }
.check input:checked + .marca-c { background: var(--pet); border-color: var(--pet); }
.check input:checked + .marca-c svg { opacity: 1; transform: none; }
.check input:focus-visible + .marca-c { outline: 2px solid var(--pet); outline-offset: 2px; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: var(--r-c); border: 1px solid var(--linea); background: var(--sup); font-weight: 600; font-size: 14px; color: var(--tinta); text-decoration: none; cursor: pointer; white-space: nowrap; box-shadow: inset 0 1px 0 rgba(255,255,255,.9), inset 0 -2px 0 rgba(22,32,30,.05), 0 1px 2px rgba(22,32,30,.06); transition: transform .12s var(--e), box-shadow .2s var(--e), background .2s var(--e), border-color .2s var(--e); }
.btn:hover { border-color: #CBD4CF; background: var(--sup-2); }
.btn:active { transform: translateY(1px); box-shadow: inset 0 1px 2px rgba(22,32,30,.08); }
.btn.p { background: var(--pet); border-color: var(--pet-o); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.18), inset 0 -2px 0 rgba(0,0,0,.18), 0 1px 2px rgba(11,70,68,.3), 0 6px 14px -6px rgba(15,92,90,.5); }
.btn.p:hover { background: #106662; }
.btn.grande { height: 48px; font-size: 15px; border-radius: 12px; }
.btn.ancho { width: 100%; }
.btn .flecha { transition: transform .25s var(--e); }
.btn:hover .flecha { transform: translateX(3px); }
.btn .giro { display: none; width: 18px; height: 18px; border-radius: 50%; border: 2px solid rgba(255,255,255,.35); border-top-color: #fff; animation: gira .7s linear infinite; }
.btn.cargando { pointer-events: none; opacity: .92; }
.btn.cargando .giro { display: block; } .btn.cargando .flecha { display: none; }
@keyframes gira { to { transform: rotate(360deg); } }
.btn.fantasma { border-color: transparent; background: transparent; box-shadow: none; color: var(--pet); }
.btn.fantasma:hover { background: var(--pet-ss); }
.btn.chico { height: 34px; padding: 0 12px; font-size: 13.5px; border-radius: 9px; }

.sep { display: flex; align-items: center; gap: 12px; color: var(--tinta-3); font-size: 12.5px; margin: 22px 0 16px; }
.sep::before, .sep::after { content: ""; flex: 1; height: 1px; background: var(--linea); }
.nota-seg { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 18px; font-size: 12.5px; color: var(--tinta-3); }
.nota-seg svg { width: 14px; height: 14px; }
.legal { margin-top: 14px; font-size: 12px; color: var(--tinta-3); text-align: center; }
.aviso { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 12px; font-size: 13.5px; border: 1px solid transparent; animation: sacude .4s var(--e); }
.aviso svg { margin-top: 1px; width: 17px; height: 17px; }
.aviso.critico { background: var(--ladrillo-s); border-color: rgba(179,74,67,.2); color: #6E2A25; }
.aviso.info { background: var(--pet-ss); border-color: rgba(15,92,90,.14); color: var(--pet-o); }
@keyframes sacude { 0%, 100% { transform: none; } 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }

/* Contraseña: requisitos en vivo */
.fuerza { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin-top: 9px; }
.fuerza i { height: 4px; border-radius: 999px; background: #E6EBE8; transition: background .3s var(--e); }
.fuerza[data-n="1"] i:nth-child(-n+1) { background: var(--ladrillo); }
.fuerza[data-n="2"] i:nth-child(-n+2) { background: #D69A3A; }
.fuerza[data-n="3"] i:nth-child(-n+3) { background: var(--turq); }
.fuerza[data-n="4"] i { background: var(--verde); }
.reqs { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 5px; font-size: 12.5px; color: var(--tinta-3); }
.reqs li { display: flex; align-items: center; gap: 7px; transition: color .2s; }
.reqs li .o { width: 15px; height: 15px; border-radius: 50%; border: 1.5px solid #C5CEC9; display: grid; place-items: center; transition: background .2s, border-color .2s; }
.reqs li .o svg { width: 9px; height: 9px; stroke-width: 3.5; color: #fff; opacity: 0; }
.reqs li.ok { color: #2F7A3A; }
.reqs li.ok .o { background: var(--verde); border-color: var(--verde); }
.reqs li.ok .o svg { opacity: 1; }

/* ---------- Tarjeta centrada (estados de un paso) ---------- */
.centro { min-height: 100vh; display: flex; flex-direction: column; align-items: center; padding: 32px 20px; background: radial-gradient(50% 40% at 50% 0%, rgba(25,164,161,.10), transparent 70%), var(--fondo); position: relative; }
.centro::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(22,32,30,.06) 1px, transparent 1px); background-size: 22px 22px; mask-image: radial-gradient(60% 50% at 50% 30%, #000, transparent 75%); pointer-events: none; }
.centro > * { position: relative; }
.centro .logo-c img { height: 28px; display: block; }
.caja { width: 100%; max-width: 440px; margin: auto; background: var(--sup); border: 1px solid var(--linea); border-radius: 18px; box-shadow: var(--sombra-3); padding: 36px 34px 30px; position: relative; overflow: hidden; }
.caja::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, var(--pet), var(--turq), var(--verde)); }
.caja .h1 { font-size: 25px; }
.caja .sub { font-size: 14.5px; }
.ico-g { position: relative; width: 52px; height: 52px; border-radius: 15px; display: grid; place-items: center; margin-bottom: 20px; background: var(--pet-s); color: var(--pet); }
.ico-g svg { width: 24px; height: 24px; }
.ico-g.ocre { background: var(--ocre-s); color: var(--ocre); } .ico-g.rojo { background: var(--ladrillo-s); color: var(--ladrillo); }
.ico-g.vivo::after { content: ""; position: absolute; inset: 0; border-radius: inherit; border: 2px solid var(--turq); animation: halo 2.2s var(--e) infinite; }
@keyframes halo { from { transform: scale(1); opacity: .7; } to { transform: scale(1.5); opacity: 0; } }
.correo-dest { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; padding: 8px 12px; border-radius: 10px; background: var(--sup-2); border: 1px solid var(--linea); font-weight: 600; font-size: 14px; }
.correo-dest svg { width: 16px; height: 16px; color: var(--tinta-3); }
.dos-b { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 20px; }
.tip { margin-top: 18px; padding: 14px 16px; border-radius: 12px; background: var(--sup-2); border: 1px solid var(--linea-2); font-size: 13.5px; color: var(--tinta-2); }
.tip b { display: block; color: var(--tinta); margin-bottom: 2px; }
.pie-caja { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--linea-2); font-size: 13.5px; color: var(--tinta-2); text-align: center; }
.pie-centro { margin-top: 18px; font-size: 12.5px; color: var(--tinta-3); text-align: center; }
.pie-centro a { color: var(--tinta-2); text-decoration: none; }

/* Código de 6 dígitos */
.otp { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin-top: 24px; }
.otp input { width: 100%; height: 56px; text-align: center; font-size: 24px; font-weight: 700; border: 1px solid var(--linea); border-radius: 12px; background: var(--sup); outline: none; caret-color: var(--pet); transition: border-color .2s, box-shadow .2s, transform .15s var(--e); font-variant-numeric: tabular-nums; }
.otp input:focus { border-color: var(--pet); box-shadow: 0 0 0 4px rgba(15,92,90,.1); }
.otp input.lleno { border-color: #9FC7BF; background: var(--pet-ss); }
.otp .guion { display: none; }
.otp.error input { border-color: var(--ladrillo); animation: sacude .4s var(--e); }
.recup { display: none; margin-top: 24px; }
.modo-recup .otp { display: none; } .modo-recup .recup { display: block; }

/* ---------- Celular ---------- */
@media (max-width: 820px) {
  .entrada { grid-template-columns: 1fr; }
  .vitrina { display: none; }
  .lado-form { padding: 18px 20px; }
  .logo-m { display: block; }
  .arriba .txt-largo { display: none; }
  .form-c { padding: 28px 0; margin: 24px auto auto; }
  .h1 { font-size: 26px; }
  .caja { padding: 30px 22px 24px; border-radius: 16px; }
  .otp { gap: 6px; } .otp input { height: 50px; font-size: 21px; }
}

/* ===== Producto (no estaba en el boceto) ===== */
.skip { position: absolute; left: -9999px; }
.skip:focus { left: 12px; top: 12px; z-index: 90; background: #fff; padding: 8px 12px; border-radius: 8px; }
.chip-bol[data-s="banca"] { --c: #0F5C5A; --s: #E2EFEC; }
.chip-bol[data-s="comercio-exterior"] { --c: #127A78; --s: #DDF1F0; }
.chip-bol[data-s="construccion"] { --c: #94611A; --s: #F6ECDC; }
.chip-bol[data-s="coyuntura"] { --c: #3B7A45; --s: #E3F1E4; }
html:not(.js) .solo-js { display: none !important; }
.js .sin-js { display: none !important; }
.otp-real { letter-spacing: .3em; text-align: center; font-size: 22px !important; font-weight: 700; }
.js .modo-otp .otp-real-campo { display: none; }
.otp { display: none; }
.js .modo-otp .otp { display: grid; }
.caja .f { margin-top: 22px; }
.caja .f:first-child { margin-top: 0; }
.mensajes { display: grid; gap: 8px; margin-top: 18px; }
.mensajes .aviso { animation: none; }
.pie-caja a, .legal a { color: var(--pet); }
.pie-caja .btn.fantasma { margin-bottom: 4px; }
.lista-err { margin: 0; padding-left: 18px; }

/* Formularios genéricos de allauth dentro de la tarjeta (restablecer contraseña y similares) */
.campo { min-width: 0; }
/* Only allauth's plain fields (input right under .campo); fields with an icon use .ctl from the boceto. */
.campo > input:not([type=checkbox]):not([type=radio]) { width: 100%; height: 46px; padding: 0 14px; border: 1px solid var(--linea); border-radius: 11px; background: var(--sup); outline: none; font-size: 15px; transition: border-color .2s var(--e), box-shadow .2s var(--e); }
.campo > input:focus { border-color: var(--pet); box-shadow: 0 0 0 4px rgba(15,92,90,.1); }
.form-acciones { display: grid; gap: 10px; margin-top: 4px; }
.btn.s { }
.btn.enlace { border-color: transparent; background: none; box-shadow: none; color: var(--pet); }
.aviso-b { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 12px; font-size: 13.5px; border: 1px solid transparent; margin-bottom: 14px; }
.aviso-b.critico { background: var(--ladrillo-s); border-color: rgba(179,74,67,.2); color: #6E2A25; }
.aviso-b.info { background: var(--pet-ss); border-color: rgba(15,92,90,.14); color: var(--pet-o); }
.aviso-b svg { width: 17px; height: 17px; margin-top: 1px; }
.h2 { font-size: 16px; margin: 18px 0 8px; }
.texto-2 { color: var(--tinta-2); }

.caja > .mensajes:first-child { margin: 0 0 22px; }

/* ── Revisión de interfaz (5 oct 2026, docs/REVISION_UI.md) ── */
.btn:active { transform: scale(.97); }
@media (hover: none) { .btn:hover .flecha { transform: none; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; } }

/* Legal documents (terms, privacy) */
.doc { min-height: 100vh; padding: 28px 16px 48px; display: flex; flex-direction: column; align-items: center; }
.doc .logo-c { align-self: center; margin-bottom: 22px; }
.doc-caja { width: 100%; max-width: 760px; background: var(--sup); border: 1px solid var(--linea); border-radius: 18px; padding: 40px 48px; box-shadow: 0 1px 2px rgba(22,32,30,.04), 0 12px 32px rgba(22,32,30,.06); }
.doc-borrador { margin-bottom: 28px; padding: 12px 14px; border-radius: 12px; background: #FBF1DF; color: #6B4B10; font-size: 13.5px; line-height: 1.5; }
.doc-ceja { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--pet); }
.doc h1 { margin: 6px 0 0; font-size: 34px; letter-spacing: -.02em; line-height: 1.15; }
.doc-fecha { margin: 8px 0 0; color: var(--tinta-3); font-size: 14px; }
.doc h2 { margin: 34px 0 0; font-size: 18px; letter-spacing: -.01em; }
.doc p, .doc li { color: var(--tinta-2); font-size: 15px; line-height: 1.65; }
.doc p { margin: 10px 0 0; }
.doc ul { margin: 10px 0 0; padding-left: 20px; }
.doc li { margin: 6px 0; }
.doc li b { color: var(--tinta); }
.doc a { color: var(--pet); }
.doc-pie { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--linea); font-size: 14px; }
@media (max-width: 640px) { .doc-caja { padding: 28px 20px; } .doc h1 { font-size: 28px; } }

/* Sign-up on the phone: the value the desktop panel shows (walk-through 7 Oct 2026) */
.valor-m { display: none; }
@media (max-width: 820px) {
  .valor-m { display: grid; gap: 6px; margin: 14px 0 4px; padding: 0; list-style: none; font-size: 13.5px; color: var(--tinta-2); }
  .valor-m li { display: flex; gap: 8px; align-items: baseline; }
  .valor-m li::before { content: ""; width: 6px; height: 6px; border-radius: 2px; background: var(--turq); flex: none; transform: translateY(-1px); }
}

/* Titular de la última edición: nunca más de tres líneas (14 oct 2026) */
.mini h4 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }