/* BCN HUB — Base
   Reset suave, elementos HTML puros (body, headings, links, scrollbars).
   Nada de clases acá — eso va en layout.css o components.css. */

body {
  font-family: var(--ff-sans);
  font-size: var(--fs-base);
  line-height: var(--lh-relaxed);
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--text-heading);
  font-weight: var(--fw-semibold);
  line-height: var(--lh-tight);
}

a {
  color: var(--accent);
  text-decoration: none;
  transition: color var(--transition-fast);
}
a:hover { color: var(--accent-hover); }

/* Scrollbar sutil — mismo bg que las cards para que no distraiga */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: var(--radius-pill);
  border: 2px solid var(--bg);
}
::-webkit-scrollbar-thumb:hover { background: var(--border-strong); }

/* Selección */
::selection { background: var(--accent-dim); color: var(--text-heading); }

/* Helpers tipográficos — solo los que extienden Bootstrap con nuestros tokens */
.text-secondary { color: var(--text-muted) !important; }
.text-heading   { color: var(--text-heading); }
.text-accent    { color: var(--accent); }
.text-mono      { font-family: var(--ff-mono); }