:root {
  --tinta: #111111;
  --papel: #ECE5D3;
  --rojo: #D2453A;
  --gris: #9A958A;
  --linea: #2A2824;
}
* { box-sizing: border-box; }
html { background: var(--tinta); }
body {
  margin: 0;
  background: var(--tinta);
  color: var(--papel);
  font: 17px/1.65 "IBM Plex Serif", Georgia, serif;
}
main { max-width: 44rem; margin: 0 auto; padding: 3rem 16px 4rem; }
header { border-bottom: 1px solid var(--linea); padding-bottom: 1.25rem; margin-bottom: 2rem; }
.marca {
  font: 700 1.9rem/1 "Oswald", "Arial Narrow", sans-serif;
  letter-spacing: .06em; text-transform: uppercase; color: var(--papel); text-decoration: none;
}
.lema { color: var(--gris); margin: .5rem 0 0; font-style: italic; }
h1 { font: 600 1.6rem/1.2 "Oswald", "Arial Narrow", sans-serif; text-transform: uppercase; letter-spacing: .04em; margin: 0 0 .25rem; }
h2 { font: 600 1.15rem/1.3 "Oswald", "Arial Narrow", sans-serif; text-transform: uppercase; letter-spacing: .04em; margin: 2rem 0 .5rem; }
.fecha, code { font-family: "IBM Plex Mono", Menlo, monospace; font-size: .85em; }
.fecha { color: var(--gris); margin: 0 0 1.5rem; }
a { color: var(--papel); text-decoration-color: var(--rojo); text-underline-offset: 3px; }
a:hover { color: var(--rojo); }
ul { padding-left: 1.2rem; }
footer { margin-top: 3rem; padding-top: 1.25rem; border-top: 1px solid var(--linea); color: var(--gris); font-size: .9rem; }
footer a { color: var(--gris); }