/* ═══════════════════════════════════════════════════════════════
   RESET & BASE — reset.css
   ═══════════════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; -webkit-text-size-adjust: 100%; }
body {
  background: var(--steel-900);
  color: var(--steel-100);
  font-family: var(--font-body);
  font-weight: 400;
  line-height: 1.6;
  overflow-x: hidden;
  min-height: 100vh;
}
a { color: inherit; text-decoration: none; }
img, video { max-width: 100%; display: block; }
ul, ol { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  border: none;
  outline: none;
}
table { border-collapse: collapse; width: 100%; }

/* ── Utility ────────────────────────────────────────────────── */
.visually-hidden {
  position: absolute; width: 1px; height: 1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap;
}
.amber          { color: var(--amber); }
.text-white     { color: var(--white); }
.text-muted     { color: var(--steel-300); }
.text-upper     { text-transform: uppercase; }
.text-center    { text-align: center; }
.nowrap         { white-space: nowrap; }

/* ── Tag / badge ─────────────────────────────────────────────── */
.tag {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--amber);
  border: 1px solid var(--amber-dim);
  padding: 3px 10px;
  border-radius: 2px;
  margin-bottom: var(--space-sm);
}

/* ── Scroll-reveal ──────────────────────────────────────────── */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.65s var(--ease), transform 0.65s var(--ease);
}
.reveal.visible    { opacity: 1; transform: none; }
.reveal-delay-1    { transition-delay: 0.1s; }
.reveal-delay-2    { transition-delay: 0.2s; }
.reveal-delay-3    { transition-delay: 0.3s; }
.reveal-delay-4    { transition-delay: 0.4s; }

/* ── Breadcrumb ─────────────────────────────────────────────── */
.breadcrumb {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  color: var(--steel-400);
  padding: 12px 0;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.breadcrumb a { color: var(--steel-300); transition: color var(--transition); }
.breadcrumb a:hover { color: var(--amber); }
.breadcrumb .sep { color: var(--steel-600); }
.breadcrumb .current { color: var(--amber); }