/* ==========================================================================
   EA4 Mobilidade — tokens da marca (base comum dos dois clients)
   Fonte: CSS do site ea4mobilidade.com.br (extraído em 11/09/2026)
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

:root {
  /* Marca */
  --brand:        #fd5b01;
  --brand-hover:  #e05200;
  --brand-dark:   #db4e03;
  --brand-tint:   #ffecdc;
  --brand-tint-2: #fff4ec;
  --brand-border: #ffddce;

  /* Texto */
  --text:       #0f172a;
  --text-muted: #4a5463;
  --text-soft:  #64748b;

  /* Superfícies */
  --bg:            #f5f5f5;
  --surface:       #ffffff;
  --surface-alt:   #f1f5f9;
  --border:        #e2eaf2;
  --border-strong: #d7dee6;

  /* Seções escuras */
  --dark:      #1d2431;
  --dark-deep: #0f172a;
  --dark-teal: #0f2c3f;

  /* Estados */
  --success:      #16a34a;
  --success-tint: #e3f8eb;
  --warning:      #b45309;
  --warning-tint: #fef3c7;
  --danger:       #dc2626;
  --danger-tint:  #fee2e2;
  --info:         #2563eb;
  --info-tint:    #dbeafe;
  --whatsapp:     #25d366;

  /* Formas (medidas no site) */
  --radius-input: 6px;
  --radius-btn:   8px;
  --radius-card:  12px;
  --radius-md:    16px;
  --radius-lg:    24px;
  --radius-pill:  32px;

  --shadow-sm: 0 1px 2px rgba(15,23,42,.06);
  --shadow-md: 0 4px 16px rgba(15,23,42,.08);
  --shadow-lg: 0 12px 40px rgba(15,23,42,.12);

  --font: "Poppins", -apple-system, "Segoe UI", system-ui, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { font-family: var(--font); color: var(--text); background: var(--bg); -webkit-font-smoothing: antialiased; }
img { max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font-family: inherit; }

/* Selo usado em tudo que ainda depende de validação com a EA4 */
.selo-validar {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--warning-tint); color: var(--warning);
  border: 1px dashed #f59e0b; border-radius: var(--radius-pill);
  padding: 3px 10px; font-size: 11px; font-weight: 600; white-space: nowrap;
}
.selo-proposta {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--info-tint); color: var(--info);
  border: 1px dashed #60a5fa; border-radius: var(--radius-pill);
  padding: 3px 10px; font-size: 11px; font-weight: 600; white-space: nowrap;
}
.demo-flag {
  position: fixed; left: 12px; bottom: 12px; z-index: 50;
  background: var(--dark-deep); color: #fff; font-size: 11px; font-weight: 500;
  padding: 6px 12px; border-radius: var(--radius-pill); opacity: .85;
}
.ico { display: inline-block; vertical-align: middle; flex-shrink: 0; }