/* ==========================================================================
   base.css — Typography, base colors and global variables
   Custom styling layer for "En Tierra de Nadie" (CEAR).
   Applied on top of css/vendor/fluida.css.
   ========================================================================== */

:root {
  /* Open Sans is used as the primary typeface. */
  --ff-main: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI',
             Roboto, Helvetica, Arial, sans-serif;
  --color-bg: #000000;
  --color-text: #ffffff;
  --color-muted: #bababa;
  --color-hairline: #141414;
}

/* --- Typography root --------------------------------------------------- */
html {
  font-family: var(--ff-main);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.8;
}

body {
  color: var(--color-text);
  background-color: var(--color-bg);
}

/* --- Headings ---------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--ff-main);
  font-weight: 400;
}

h1 { font-size: 2.33em; }
h2 { font-size: 2.06em; }
h3 { font-size: 1.79em; }
h4 { font-size: 1.52em; }
h5 { font-size: 1.25em; }
h6 { font-size: 0.98em; }

.entry-title,
#reply-title {
  font-family: var(--ff-main);
  font-size: 250%;
  font-weight: 300;
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4 {
  color: var(--color-text);
}

/* --- Enlaces ------------------------------------------------------------ */
a { color: var(--color-text); }
a:hover { color: var(--color-text); }

/* --- Ritmo vertical del contenido -------------------------------------- */
.main p,
.main ul,
.main ol,
.main dd,
.main pre,
.main hr { margin-bottom: 1em; }

.main .entry-content p { text-indent: 0; }

/* --- Elementos varios --------------------------------------------------- */
code { background-color: #111111; }
pre { border-color: #111111; }
hr { background-color: #161616; }

/* --- Formularios (base) ------------------------------------------------- */
select, input[type], textarea {
  color: var(--color-text);
  border-color: #161616;
}
input[type]:hover, textarea:hover, select:hover,
input[type]:focus, textarea:focus, select:focus {
  border-color: #323232;
}
button,
input[type="button"], input[type="submit"], input[type="reset"] {
  background-color: #ffffff;
  color: #000000;
}
button:hover,
input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover {
  background-color: #ffffff;
}
