/* La cabecera y el pie de las páginas interiores (Lab, Diary, legal), iguales que los de la portada (4-11). Cada página define
   sus colores (--noche, --panel, --linea, --texto, --suave, --oro, --rosa) y sus fuentes (--f-pixel, --f-texto). */
.marco-ancho { max-width: 2200px; margin: 0 auto; padding-inline: clamp(16px, 2.2vw, 40px); }
header.arriba { border-bottom: 1px solid var(--linea); position: sticky; top: env(safe-area-inset-top, 0px); background: color-mix(in srgb, var(--noche) 92%, transparent); backdrop-filter: blur(6px); z-index: 5; }
header.arriba .marco-ancho { display: flex; align-items: center; gap: 12px 24px; flex-wrap: wrap; padding-block: 12px; }
.logo { font: 400 1.5rem/1 var(--f-pixel); color: var(--oro); text-decoration: none; display: flex; gap: .4em; align-items: baseline; }
.logo span { color: var(--rosa); }
header.arriba nav { display: flex; gap: 6px 18px; flex-wrap: wrap; flex: 1; }
header.arriba nav a { color: var(--suave); text-decoration: none; font-weight: 700; font-size: .95rem; white-space: nowrap; }
header.arriba nav a:hover, header.arriba nav a[aria-current] { color: var(--texto); }
header.arriba .boton { font: 700 .9rem/1 var(--f-texto); border-radius: 6px; padding: 10px 14px; text-decoration: none; color: var(--texto); box-shadow: inset 0 0 0 1px var(--linea); }
@media (max-width: 640px) { .logo { font-size: 1.2rem; } header.arriba nav { order: 3; flex: 1 0 100%; overflow-x: auto; flex-wrap: nowrap; } header.arriba .boton { margin-left: auto; padding: 8px 10px; font-size: .82rem; } }
footer.pie { border-top: 1px solid var(--linea); background: color-mix(in srgb, var(--panel) 45%, var(--noche)); color: var(--suave); font-size: .85rem; line-height: 1.55; }
footer.pie .marco-ancho { display: grid; gap: 24px; padding-block: 32px 44px; }
@media (min-width: 980px) { footer.pie .marco-ancho { grid-template-columns: minmax(240px, 1fr) minmax(0, 2fr) minmax(240px, 1fr); gap: 48px; } }
footer.pie .marco-ancho > div { display: grid; gap: 8px; align-content: start; min-width: 0; }
footer.pie p { margin: 0; max-width: none; }
footer.pie .logo { font-size: 1.3rem; }