/* Utilitarios reutilizaveis. Substituem style="..." inline (proibido pela vault
   Sistema_de_Estilos). Toda tela usa classe, nunca estilo inline. */

/* Espacamento */
.mt-2 { margin-top: var(--sp-2); }
.mt-3 { margin-top: var(--sp-3); }
.mt-4 { margin-top: var(--sp-4); }
.mt-5 { margin-top: var(--sp-5); }
.mt-6 { margin-top: var(--sp-6); }
.mt-7 { margin-top: var(--sp-7); }
.mb-0 { margin-bottom: 0; }
.mb-2 { margin-bottom: var(--sp-2); }
.mb-3 { margin-bottom: var(--sp-3); }
.mb-4 { margin-bottom: var(--sp-4); }
.mb-5 { margin-bottom: var(--sp-5); }
.mb-6 { margin-bottom: var(--sp-6); }
.mx-auto { margin-left: auto; margin-right: auto; }

/* Texto */
.text-center { text-align: center; }
.text-dim { color: var(--text-dim); }
.text-mute { color: var(--text-mute); }
.text-accent { color: var(--accent); }
.lead { font-size: 20px; color: var(--text-dim); line-height: 1.6; }
.lead-sm { font-size: 18px; color: var(--text-dim); line-height: 1.6; }
.title-md { font-size: clamp(32px, 5vw, 56px); }

/* Layout */
.section { padding: var(--sp-8) 0; }
.section-hero { padding: var(--sp-9) 0 var(--sp-8); }
.section-cta { padding: var(--sp-8) 0 var(--sp-9); }
.container-narrow { max-width: 820px; margin-left: auto; margin-right: auto; }
.container-mid { max-width: 720px; margin-left: auto; margin-right: auto; }
.container-form { max-width: 640px; margin-left: auto; margin-right: auto; }
.measure { max-width: 640px; margin-left: auto; margin-right: auto; }
.w-full { width: 100%; }

.btn-row { display: flex; gap: var(--sp-3); flex-wrap: wrap; }
.btn-row.center { justify-content: center; }

.feature-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: var(--sp-5);
}

.flash-wrap { margin-top: var(--sp-4); }

/* noscript do GTM (fica escondido; sem inline style) */
.gtm-noscript { display: none; visibility: hidden; }