/* Componentes de referencia — copiados tal cual de NEW_MAIA_BRAND_componentes.css */
.mb-btn { font-family: var(--font-sans); font-weight: 800; border-radius: var(--radius-pill); border: var(--stroke) solid var(--line); cursor: pointer; display: inline-flex; align-items: center; gap: var(--space-2); line-height: 1; transition: background-color .15s ease, color .15s ease; }
.mb-btn--md { font-size: 16px; padding: 14px var(--space-6); }
.mb-btn--sm { font-size: 14px; padding: 10px var(--space-4); }
.mb-btn--primary { background: var(--surface-accent); color: var(--on-accent); border-color: var(--on-accent); }
.mb-btn--primary:hover { background: var(--on-accent); color: var(--surface-accent); }
.mb-btn--secondary { background: var(--ink-display); color: var(--surface); border-color: var(--ink-display); }
.mb-btn--secondary:hover { background: transparent; color: var(--ink-display); }
.mb-btn--ghost { background: transparent; color: var(--ink); }
.mb-btn--ghost:hover { background: var(--surface-alt); }
.mb-btn:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.mb-btn:disabled { opacity: .45; cursor: not-allowed; }
.mb-tag { display: inline-flex; align-items: center; font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 500; padding: 2px var(--space-3); border-radius: var(--radius-pill); border: var(--stroke) solid var(--line); color: var(--ink); background: transparent; white-space: nowrap; }
.mb-tag--filled { background: var(--surface-accent); color: var(--on-accent); border-color: var(--on-accent); }
.mb-tag--soft { background: var(--malva); color: var(--abeto); border-color: transparent; }
.mb-tag--lg { font-family: var(--font-display); font-weight: 700; font-size: 28px; line-height: 34px; padding: 2px var(--space-4); }
.mb-tag--caps { font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; font-size: 14px; padding: 4px var(--space-4); }
.mb-callout { display: inline-block; margin: 0; font-family: var(--font-display); font-weight: 700; font-size: 32px; line-height: 38px; color: var(--on-accent); background: var(--surface-accent); border-radius: var(--radius-pill); padding: var(--space-3) var(--space-8); text-wrap: balance; }
.mb-card { border-radius: var(--radius-lg); padding: var(--space-6); display: flex; flex-direction: column; gap: var(--space-3); font-family: var(--font-sans); font-size: 16px; line-height: 24px; }
.mb-card--light { background: var(--surface); color: var(--ink); border: var(--stroke) solid var(--line); }
.mb-card--lima { background: var(--lima); color: var(--abeto); border: var(--stroke) solid var(--abeto); }
.mb-card--dark { background: var(--abeto); color: var(--lima); border: var(--stroke) solid var(--lima); }
.mb-card__title { margin: 0; font-family: var(--font-display); font-weight: 700; font-size: 28px; line-height: 34px; text-wrap: balance; }
.mb-card--dark .mb-card__title { color: var(--lima); }
.mb-card__body { min-width: 0; }
.mb-card__body ul { margin: 0; padding-left: 1.1em; display: grid; gap: var(--space-1); }
.mb-pillar { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--space-3); font-family: var(--font-sans); color: var(--ink); max-width: 300px; }
.mb-pillar__eyebrow { font-size: 13px; line-height: 18px; color: var(--ink-muted); }
.mb-pillar__arrow { font-size: 24px; line-height: 1; color: var(--ink-muted); }
.mb-pillar__body { font-size: 15px; line-height: 22px; }
.mb-sechead { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: var(--space-3); font-family: var(--font-sans); font-size: 12px; line-height: 16px; }
.mb-sechead > span:empty { display: block; }
.mb-sechead__section { justify-self: start; background: var(--ink-display); color: var(--surface); border-radius: var(--radius-pill); padding: 2px var(--space-3); }
.mb-sechead__sub { justify-self: center; color: var(--ink); border: var(--stroke) solid var(--line); border-radius: var(--radius-pill); padding: 2px var(--space-3); }
.mb-sechead__page { justify-self: end; background: var(--malva); color: var(--abeto); border-radius: var(--radius-pill); padding: 2px var(--space-3); }