/* Tá Fácil - Web brand tokens
   Wordmark must always come from the official SVG; do not typeset it manually. */

:root {
  --tf-brand-teal: #004D4A;
  --tf-brand-blue: #0067FF;
  --tf-brand-green: #00B67A;
  --tf-brand-white: #FFFFFF;
  --tf-brand-offwhite: #F7F7F2;
  --tf-brand-dark: #0D0F10;

  --tf-text-primary: #173B39;
  --tf-text-muted: #60706F;
  --tf-border: #DCE5E3;
  --tf-surface: #FFFFFF;
  --tf-surface-alt: #EEF4F2;

  --tf-radius-sm: 10px;
  --tf-radius-md: 16px;
  --tf-radius-lg: 24px;

  --tf-space-1: 4px;
  --tf-space-2: 8px;
  --tf-space-3: 12px;
  --tf-space-4: 16px;
  --tf-space-5: 24px;
  --tf-space-6: 32px;
  --tf-space-7: 48px;
  --tf-space-8: 64px;

  --tf-shadow-soft: 0 8px 28px rgba(0, 77, 74, 0.10);
}

body {
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--tf-text-primary);
  background: var(--tf-brand-offwhite);
}

.tf-button-primary {
  background: var(--tf-brand-teal);
  color: #fff;
  border-radius: var(--tf-radius-sm);
}

.tf-button-accent {
  background: var(--tf-brand-blue);
  color: #fff;
  border-radius: var(--tf-radius-sm);
}