/* v241 · Orden y secuencia: cada página tiene su cabecera, sus secciones numeradas (1, 2, 3…), sus incisos (1.1, 1.2…)
   y un enlace «Siguiente página». Solo cambia el orden y la presentación: no toca ids, datos ni scripts. */

/* Las tarjetas se ordenan con "order" (lo asigna orden.js). El grupo «En común» deja de ser una caja:
   sus tarjetas pasan a ordenarse junto con las demás de la página. */
main{display:flex;flex-direction:column}
main>*{flex:none;min-width:0}
main>h1{order:-100}
main>.sub{order:-99}
#g-com{display:contents}
#g-com>.gh,#g-com>.gd{display:none!important}

/* Cabecera de página */
#pg-head{margin:0 0 14px;padding:0}
#pg-head .pg-eyebrow{margin:0;font-size:.72rem;font-weight:800;letter-spacing:.08em;color:var(--ac)}
#pg-head .pg-title{margin:2px 0 0;font-size:1.45rem;letter-spacing:-.02em;color:var(--tx)}
#pg-head .pg-lead{margin:2px 0 0;color:var(--mut);font-size:.92rem}
#pg-head .pg-chips{display:flex;gap:8px;margin:12px -14px 0;padding:2px 14px 6px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
#pg-head .pg-chips::-webkit-scrollbar{display:none}
#pg-head .pg-chips a{flex:none;display:inline-flex;align-items:center;gap:7px;max-width:220px;min-height:38px;padding:0 13px 0 7px;border-radius:999px;background:var(--card);border:1.5px solid var(--bd);color:var(--tx);font-size:.84rem;font-weight:600;text-decoration:none;box-shadow:var(--sh)}
#pg-head .pg-chips a b{flex:none;display:inline-grid;place-items:center;min-width:24px;height:24px;border-radius:50%;background:var(--ac);color:#fff;font-size:.76rem}
#pg-head .pg-chips a span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#pg-head .pg-chips a:active{background:var(--ac2)}

/* Números de las secciones (nivel 1) y de los incisos (nivel 2 y 3) */
[data-n]::before{content:attr(data-n);display:inline-grid;place-items:center;flex:none;vertical-align:middle;
  min-width:1.7em;height:1.7em;padding:0 .35em;margin-right:.5em;border-radius:999px;box-sizing:border-box;
  background:var(--ac);color:#fff;font-size:.72em;font-weight:800;letter-spacing:0;line-height:1}
[data-nl="2"]::before,[data-nl="3"]::before{background:var(--ac2);color:var(--ac);font-size:.7em}
.gh[data-n]::before{width:auto;height:1.7em;border-radius:999px;background:var(--gc,var(--ac));color:#fff}

/* Siguiente / anterior página */
#pg-foot{order:940;display:flex;gap:10px;margin:6px 0 14px;padding:0}
#pg-foot button{flex:1;min-height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;line-height:1.25;font-size:.95rem}
#pg-foot button small{font-size:.7rem;font-weight:700;letter-spacing:.06em;opacity:.8}
#pg-foot button.sec{background:var(--card);border:1.5px solid var(--bd);color:var(--tx)}
#pg-foot button[hidden]{display:none}
@media (prefers-reduced-motion:reduce){#pg-head .pg-chips{scroll-behavior:auto}}
