/* ============================================================
   BrainChain · base.css
   reset, body, typography, link defaults, scrollbar
============================================================ */

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; tab-size: 4; }

body {
  font-family: var(--bc-font-sans);
  font-size: var(--bc-fs-14);
  line-height: var(--bc-lh-normal);
  color: var(--bc-text-secondary);
  background: var(--bc-bg-primary);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "ss01", "cv11";
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--bc-font-sans);
  font-weight: var(--bc-fw-semibold);
  color: var(--bc-text-primary);
  margin: 0;
  letter-spacing: var(--bc-ls-tight);
  line-height: var(--bc-lh-snug);
  text-wrap: balance;
}
p { margin: 0; text-wrap: pretty; }
a { color: inherit; text-decoration: none; }
a:focus-visible, button:focus-visible, input:focus-visible {
  outline: none;
  box-shadow: var(--bc-shadow-focus-ring);
  border-radius: var(--bc-radius-sm);
}
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; padding: 0; }
img, svg { display: block; max-width: 100%; }
ul, ol { margin: 0; padding: 0; list-style: none; }
::selection { background: rgba(124, 58, 237, 0.45); color: #fff; }

/* Scrollbar - subtle */
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
  background: var(--bc-bg-elevated);
  border-radius: var(--bc-radius-full);
  border: 2px solid var(--bc-bg-primary);
}
*::-webkit-scrollbar-thumb:hover { background: var(--bc-border); }

/* ============================================================
   LAYOUT PRIMITIVES
============================================================ */
.bc-container {
  max-width: 1280px;
  margin: 0 auto;
  padding-left: var(--bc-space-6);
  padding-right: var(--bc-space-6);
}
@media (min-width: 768px) {
  .bc-container { padding-left: var(--bc-space-8); padding-right: var(--bc-space-8); }
}

/* Section frame */
.bc-section {
  position: relative;
  padding-top: var(--bc-space-16);
  padding-bottom: var(--bc-space-16);
  border-top: 1px solid var(--bc-border-soft);
}
.bc-section--void { background: var(--bc-bg-void); }
.bc-section--alt { background: var(--bc-bg-secondary); }
.bc-section__head {
  display: flex;
  flex-direction: column;
  gap: var(--bc-space-3);
  margin-bottom: var(--bc-space-10);
  max-width: 760px;
}
.bc-section__title {
  font-size: clamp(28px, 3.4vw, 40px);
  font-weight: var(--bc-fw-semibold);
  line-height: var(--bc-lh-tight);
  letter-spacing: -0.025em;
  color: var(--bc-text-primary);
  white-space: pre-line;
}
.bc-section__sub {
  font-size: var(--bc-fs-15);
  color: var(--bc-text-secondary);
  line-height: var(--bc-lh-relaxed);
  max-width: 60ch;
}

/* Eyebrow - bracketed mono label */
.bc-eyebrow {
  font-family: var(--bc-font-mono);
  font-size: var(--bc-fs-11);
  font-weight: var(--bc-fw-medium);
  color: var(--bc-text-tertiary);
  letter-spacing: var(--bc-ls-wide);
  text-transform: uppercase;
  display: inline-flex;
  gap: var(--bc-space-1);
  align-items: center;
}
.bc-eyebrow::before { content: "[ "; opacity: 0.6; }
.bc-eyebrow::after  { content: " ]"; opacity: 0.6; }
.bc-eyebrow--accent { color: var(--bc-accent-light); }
.bc-eyebrow--success { color: var(--bc-success); }

.bc-asterisk {
  color: var(--bc-accent-light);
  font-weight: var(--bc-fw-medium);
}

.bc-mono { font-family: var(--bc-font-mono); }
.bc-mono-sm { font-family: var(--bc-font-mono); font-size: var(--bc-fs-11); letter-spacing: var(--bc-ls-wide); }
