/* ==========================================================================
   VARIÁVEIS: fonte única de cores, tipografia, espaço e movimento.
   Nunca usar hex direto fora deste arquivo.
   ========================================================================== */

@font-face {
  font-family: 'General Sans';
  src: url('../assets/fonts/GeneralSans-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'General Sans';
  src: url('../assets/fonts/GeneralSans-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'General Sans';
  src: url('../assets/fonts/GeneralSans-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Cor: um fundo, uma tinta, um acento (mantidos do redesign anterior) */
  --bg: #0B0B0C;
  --bg-2: #0F0F11;
  --surface: #141416;
  --surface-2: #1B1B1E;
  --surface-3: #232327;
  --ink: #F2F1EE;
  --ink-2: #C9C8C4;
  --muted: #8E8D8A;
  --paper: #F2F1EE;
  --paper-2: #E6E4DF;
  --paper-ink: #0B0B0C;
  --paper-muted: #55544F;
  --accent: #FF4A1C;
  --accent-strong: #FF6A42;
  --accent-soft: rgba(255, 74, 28, 0.12);
  --accent-ink: #0B0B0C;
  --error: #FF8A73;
  --success: #4ADE80;
  --whatsapp: #25D366;
  --whatsapp-ink: #0B0B0C;

  /* Bordas leves */
  --line: rgba(255, 255, 255, 0.08);
  --line-strong: rgba(255, 255, 255, 0.14);
  --line-hover: rgba(255, 255, 255, 0.22);

  /* Cores próprias dos fragmentos de interface (data-ui) */
  --ui-chat-bg: #0B141A;
  --ui-chat-head: #1F2C34;
  --ui-bubble-in: #202C33;
  --ui-bubble-out: #005C4B;
  --ui-chat-ink: #E9EDEF;
  --ui-chat-muted: #8696A0;
  --ui-ok: #25D366;
  --ui-page: #FBFAF7;
  --ui-page-ink: #16130F;
  --ui-page-muted: #6B675F;
  --ui-page-accent: #1F6F5C;

  /* Tipografia */
  --font: 'General Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --step-xs: 0.8125rem;
  --step-small: 0.875rem;
  --step-body: 1rem;
  --step-lead: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem);
  --step-h3: 1.125rem;
  --step-head: clamp(1.875rem, 1.3rem + 1.9vw, 2.875rem);
  --step-hero: clamp(2.5rem, 1.6rem + 3.4vw, 4.25rem);

  /* Forma */
  --radius-pill: 999px;
  --radius-sm: 8px;
  --radius: 10px;
  --radius-lg: 16px;
  --shadow-float: 0 24px 60px -24px rgba(0, 0, 0, 0.7), 0 0 0 1px var(--line);

  /* Espaço */
  --margin: clamp(1.25rem, 0.8rem + 2vw, 2rem);
  --gutter: clamp(1rem, 0.7rem + 1vw, 1.5rem);
  --section: clamp(4rem, 2.5rem + 4vw, 6rem);
  --max: 1200px;
  --header-h: 3.5rem;

  /* Movimento */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.76, 0, 0.24, 1);
  --t-press: 140ms;
  --t-hover: 180ms;
  --t-ui: 240ms;
  --stagger-item: 70ms;

  /* Camadas */
  --z-nav: 100;
  --z-drawer: 90;
  --z-whatsapp: 80;
}