html{background:#FAFAF8;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0}
img{max-width:100%}

/* Cabecera: se queda arriba, se esconde al bajar y vuelve al subir un poco */
#pagina > div > header{position:sticky;top:0;z-index:50;background:#FAFAF8;box-shadow:0 0 0 100vmax #FAFAF8;clip-path:inset(0 -100vmax);transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .3s;border-bottom:1px solid transparent}
html.cab-fija #pagina > div > header{border-bottom-color:#DEDEDA}
html.cab-oculta #pagina > div > header{transform:translateY(-100%)}

/* Botón para volver arriba (solo móvil) */
.subir{position:fixed;right:calc(20px + env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:60;width:48px;height:48px;border-radius:50%;border:none;padding:0;background:#111111;color:#FAFAF8;display:none;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 6px 18px rgba(17,17,17,.18);opacity:0;transform:translateY(12px);transition:opacity .25s,transform .25s,background .2s;pointer-events:none;-webkit-tap-highlight-color:transparent}
.subir svg{width:22px;height:22px}
.subir:active{background:#1E5A47}
.subir:focus-visible{outline:2px solid #1E5A47;outline-offset:3px}
@media (max-width:600px){.subir{display:inline-flex}}
html.ver-subir .subir{opacity:1;transform:none;pointer-events:auto}
@media (prefers-reduced-motion: reduce){#pagina > div > header,.subir{transition:none}}