/* ============================================================================
   MAPTAINER — Documentación funcional pública
   ============================================================================ */
.doc-hero { padding-block: var(--sp-8) var(--sp-6); border-bottom: 1px solid var(--rule); }
.doc-hero h1 { font-size: var(--fs-h1-page); max-width: 24ch; }
.doc-hero .lead { max-width: 66ch; margin-bottom: var(--sp-5); }
.doc-hero .btn-meta { font-family: var(--font-mono); font-size: var(--fs-mono); letter-spacing: .04em; opacity: .75; }

.doc-layout { display: grid; grid-template-columns: 280px 1fr; gap: var(--sp-8); padding-block: var(--sp-7); align-items: start; }
@media (max-width: 1000px) { .doc-layout { grid-template-columns: 1fr; gap: var(--sp-5); } }

.doc-toc { position: sticky; top: calc(var(--header-h) + 20px); max-height: calc(100vh - var(--header-h) - 50px); overflow-y: auto; }
@media (max-width: 1000px) { .doc-toc { position: static; max-height: none; } }
.doc-toc summary {
  font-family: var(--font-mono); font-size: var(--fs-mono); letter-spacing: var(--tracking-label);
  text-transform: uppercase; color: var(--ink-2); cursor: pointer; padding-bottom: var(--sp-3);
  border-bottom: 1px solid var(--rule); margin-bottom: var(--sp-3);
}
.doc-toc ol { list-style: none; margin: 0; padding: 0; }
.doc-toc li { margin: 0; }
.doc-toc a {
  display: block; padding: 4px 0 4px var(--sp-3); font-size: var(--fs-cap); line-height: 1.35;
  color: var(--ink-2); text-decoration: none; border-left: 2px solid transparent;
}
.doc-toc a:hover { color: var(--accent); }
.doc-toc a[aria-current="true"] { color: var(--accent); border-left-color: var(--accent); background: var(--accent-wash); font-weight: 600; }
.doc-toc .lvl-3 a { padding-left: var(--sp-5); font-size: var(--fs-mono); }
.doc-toc .lvl-2 a { font-weight: 500; }

.doc-body { max-width: none; }
.doc-body h2 { scroll-margin-top: calc(var(--header-h) + 24px); }
.doc-body h3, .doc-body h4 { scroll-margin-top: calc(var(--header-h) + 24px); }
.doc-body > p, .doc-body > ul, .doc-body > ol, .doc-body > blockquote { max-width: var(--measure); }
