/* La política de privacidad y la página de error de cronda.app: texto para leer, con la letra y la tinta de la portada. */
/* Archivo (licencia SIL OFL, assets/archivo-OFL.txt), servida desde cronda.app: sin pedidos a terceros. Recortada a lo
   que usa la web: ancho 62 a 100 y peso 400 a 900, letras latinas. */
@font-face {
  font-family: "Archivo"; src: url("/assets/archivo.woff2") format("woff2");
  font-weight: 400 900; font-stretch: 62% 100%; font-display: swap;
}
:root { --fondo: #F6F5F1; --texto: #111418; --suave: #4A4F57; --linea: rgba(17,20,24,.14); --azul: #2457C4; }
@media (prefers-color-scheme: dark) { :root { --fondo: #0F1216; --texto: #F6F5F1; --suave: #B9BCC2; --linea: rgba(246,245,241,.16); --azul: #6F95E6; } }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fondo); color: var(--texto); font-family: "Archivo", system-ui, sans-serif; font-size: 18px; line-height: 1.6; }
a { color: var(--azul); }
a:focus-visible { outline: 3px solid var(--azul); outline-offset: 3px; border-radius: 6px; }
.page { max-width: 720px; margin: 0 auto; padding: 0 20px 56px; }
header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding: 18px 0; }
.marca { font-stretch: 62%; font-weight: 800; font-size: 28px; text-decoration: none; color: var(--texto); }
.idiomas { display: flex; align-items: center; }
.idiomas a { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; opacity: .5; transition: opacity .2s ease; }
.idiomas a:hover, .idiomas a[aria-current="page"] { opacity: 1; }
.idiomas svg { width: 26px; height: 26px; border-radius: 50%; }
.idiomas a[aria-current="page"] svg { box-shadow: 0 0 0 2px var(--fondo), 0 0 0 4px var(--texto); }
h1 { font-stretch: 62%; font-weight: 850; font-size: clamp(44px, 9vw, 72px); line-height: .95; margin: 20px 0 8px; letter-spacing: -.6px; }
h2 { font-stretch: 75%; font-weight: 750; font-size: 26px; line-height: 1.1; margin: 36px 0 8px; }
.updated { color: var(--suave); font-size: 16px; margin: 0 0 8px; }
ul { padding-left: 22px; }
li { margin: 6px 0; }
footer { margin-top: 48px; padding-top: 14px; border-top: 1px solid var(--linea); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 20px; font-size: 15px; color: var(--suave); }
footer a { color: inherit; text-decoration: none; }
footer a:hover { text-decoration: underline; color: var(--texto); }
@media (prefers-reduced-motion: reduce) { .idiomas a { transition: none; } }
