/* Seivio · estilos compartidos del sitio (Fase 12). Las páginas traen sus medidas del diseño. */
body { margin: 0; background: #fff; }
a, button { font-family: inherit; }
a { text-decoration: none; color: inherit; }
button { border: 0; background: none; padding: 0; cursor: pointer; color: inherit; }
svg { flex-shrink: 0; }

/* Presionar y foco, como en el diseño. */
a, button, label {
  transition: transform .12s ease-out, opacity .12s ease-out, box-shadow .18s ease-out, background-color .18s ease-out;
  -webkit-tap-highlight-color: transparent;
}
a:active, button:active { transform: scale(.97); opacity: .92; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid rgba(15, 118, 110, .45); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
html { scroll-behavior: smooth; }

/* Escritorio (diseño de 1280) y celular (diseño de 390) en la misma página. */
.lienzo { width: 1280px; margin: 0 auto; }
.movil { display: none; }
.movil > div { width: 100% !important; }
@media (max-width: 899px) {
  .escritorio { display: none; }
  .movil { display: block; }
}

/* Las anclas no quedan tapadas al saltar a una sección. */
.ancla { display: block; position: relative; top: -24px; visibility: hidden; }
.seccion, section[id] { scroll-margin-top: 24px; }

/* Índice de los términos: la sección que se está leyendo. */
a.indice.actual { color: #0F766E !important; font-weight: 800 !important; }
a.indice:hover { color: #0F766E; }

@media print {
  .escritorio [style*="position:sticky"], .escritorio > div > div:first-child, .escritorio > div > div:last-child { display: none !important; }
  .lienzo { width: auto; }
}
