/* #es: Ayuda en español (assets/js/pages/es.js). Light page: large text, 48px tap targets, no images.
   Uses the site tokens from app.css; every rule is scoped under .es so nothing else changes. */
.es{--es-top:0px;max-width:820px;margin:0 auto;padding:0 16px 48px;font-size:17px;line-height:1.6;color:var(--fg,#f4efe6)}
.es *{box-sizing:border-box}
.es h1{font:600 clamp(28px,6.4vw,40px)/1.15 var(--display);margin:6px 0 12px;letter-spacing:-.01em}
.es h2{font:600 clamp(24px,5vw,30px)/1.2 var(--display);margin:0 0 10px}
.es h3{font:600 20px/1.3 var(--display);margin:26px 0 8px}
.es p{margin:0 0 12px;font-size:17px}
.es a{color:var(--acc-hi,#ecd395);text-underline-offset:3px}
.es .ic{width:20px;height:20px;flex:none}

/* Salida rápida: sticky under the header (es.js sets --es-top), always on screen */
.es .es-exit-bar{position:sticky;top:var(--es-top);z-index:36;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 -16px 6px;padding:8px 16px;background:rgba(6,12,24,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line,#1d2b44)}
.es .es-exit{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:10px 18px;border:2px solid #fff;border-radius:999px;background:#fff;color:#0b1426;font:700 17px/1 var(--body);cursor:pointer;flex:none}
.es .es-exit:hover,.es .es-exit:focus-visible{outline:3px solid var(--acc,#d6b26e);outline-offset:2px}
.es .es-exit-tip{font-size:14px;color:var(--muted,#abb5c7);text-align:right}
@media (max-width:430px){.es .es-exit-tip{display:none}}
.es .es-kbd{display:none}
@media (hover:hover) and (pointer:fine){.es .es-kbd{display:inline}}

.es .es-hero{padding:22px 0 8px}
.es .es-eyebrow{font:600 13px/1 var(--label);letter-spacing:.22em;text-transform:uppercase;color:var(--acc,#d6b26e)}
.es .es-lede{color:var(--muted,#abb5c7)}

/* Buttons */
.es .esb{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 20px;border-radius:14px;border:1px solid var(--line2,#2b3d5e);background:var(--panel2,#132239);color:var(--fg,#f4efe6);font:700 17px/1.25 var(--body);text-decoration:none;text-align:center;cursor:pointer;max-width:100%;white-space:normal}
.es a.esb{color:var(--fg,#f4efe6)}
.es .esb:focus-visible{outline:3px solid var(--acc,#d6b26e);outline-offset:2px}
.es .es-call{background:var(--grad-gold,#d6b26e);border-color:rgba(243,220,166,.55)}
.es a.es-call{color:var(--acc-ink,#0b1426)}
.es .es-ghost,.es a.es-ghost{background:transparent;color:var(--fg,#f4efe6)}
.es .es-call.es-ghost{background:transparent;border-color:var(--acc-line,rgba(214,178,110,.45))}
.es a.es-call.es-ghost{color:var(--fg,#f4efe6)}
.es .es-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px;min-width:0}
.es .esb span{min-width:0;overflow-wrap:anywhere}

/* 911 and 988 cards at the top */
.es .es-sos,.es .es-988{border-radius:18px;padding:18px;margin:14px 0}
.es .es-sos{border:2px solid var(--red-strong,#c9252c);background:var(--red-dim,rgba(239,74,79,.13))}
.es .es-sos h2{color:#ffd0d1}
.es .es-911{width:100%;min-height:60px;font-size:22px;background:var(--red-strong,#c9252c);border-color:#ff8b8f;margin-top:4px}
.es a.es-911{color:#fff}
.es .es-988{border:2px solid var(--acc,#d6b26e);background:var(--acc-dim,rgba(214,178,110,.12))}
.es .es-988 .es-solid{min-width:min(100%,240px);font-size:19px}

/* Jump links */
.es .es-toc{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px;margin:18px 0 6px}
.es .es-toc a{display:flex;align-items:center;gap:10px;min-height:52px;padding:12px 14px;border:1px solid var(--line2,#2b3d5e);border-radius:14px;background:var(--panel,#0d182b);color:var(--fg,#f4efe6);text-decoration:none;font-weight:600}
.es .es-toc a .ic{color:var(--acc,#d6b26e)}

.es .es-sec{padding:30px 0 6px;border-top:1px solid var(--line,#1d2b44);margin-top:26px;scroll-margin-top:calc(var(--es-top) + 76px)}
.es .es-lead{font-size:18px}
.es .es-small,.es .es-small{font-size:16px;color:var(--muted,#abb5c7)}

/* Number list */
.es .es-nums,.es .es-xs{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.es .es-num,.es .es-x{padding:16px;border:1px solid var(--line,#1d2b44);border-radius:16px;background:var(--panel,#0d182b)}
.es .es-num-h{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 14px;margin-bottom:6px}
.es .es-num-h b,.es .es-x b{font-size:18px;line-height:1.35}
.es .es-num-d{font:700 21px/1.2 var(--body);color:var(--acc-hi,#ecd395);white-space:nowrap}
.es .es-num p,.es .es-x p{margin:0;color:var(--muted,#abb5c7)}
.es .es-num-911{border-color:var(--red-strong,#c9252c)}
.es .es-num-988{border-color:var(--acc,#d6b26e)}
.es .es-more{margin-top:16px}
.es .es-more summary{display:flex;align-items:center;min-height:48px;padding:10px 16px;border:1px solid var(--line2,#2b3d5e);border-radius:14px;cursor:pointer;font-weight:700}
.es .es-tip{margin-top:14px;padding:14px 16px;border-left:3px solid var(--acc,#d6b26e);background:var(--panel,#0d182b);border-radius:0 12px 12px 0}

/* Steps */
.es .es-steps,.es .es-props{margin:12px 0 0;padding:0 0 0 22px;display:grid;gap:16px}
.es .es-steps li::marker,.es .es-props li::marker{color:var(--acc,#d6b26e);font-weight:700}
.es .es-steps b,.es .es-props b{display:inline;font-size:18px}
.es .es-steps p,.es .es-props p{margin:6px 0 0}
.es .es-note{display:flex;gap:12px;align-items:flex-start;margin:18px 0 6px;padding:14px 16px;border:1px solid var(--line2,#2b3d5e);border-radius:14px;background:var(--panel2,#132239)}
.es .es-note .ic{color:var(--acc,#d6b26e);margin-top:3px}
.es .es-note p{margin:0}
.es .es-report{margin-top:18px;padding:16px;border:1px dashed var(--line2,#2b3d5e);border-radius:16px}
.es .es-report h3{margin-top:0}
.es .es-foot{margin-top:34px;padding-top:16px;border-top:1px solid var(--line,#1d2b44)}
.es .es-foot p{font-size:16px;color:var(--muted,#abb5c7)}

@media (max-width:520px){
  .es .es-acts .esb{flex:1 1 100%}
  .es .es-exit-tip{font-size:13px}
}
@media (min-width:1024px){
  .es{padding-top:12px}
}
@media print{.es .es-exit-bar{display:none}}