/* ==========================================================================
   Emporio Office — Design Tokens
   Variáveis globais de cor, tipografia, espaçamento e elevação.
   ========================================================================== */

:root {
  /* Marca — laranja do logo (Empório Office) */
  --brand:        #fb8c08;
  --brand-600:    #ea7d00;
  --brand-700:    #c4500a;
  --brand-soft:   #fff4e2;
  --brand-glow:   rgba(251, 140, 8, .35);

  /* Escuro institucional — carvão do logo (sem azul) */
  --navy:         #2c2c34;
  --navy-700:     #20202a;
  --navy-900:     #14141a;
  --blue:         #2c2c34;

  /* WhatsApp */
  --wpp:          #25d366;
  --wpp-600:      #1ebe5d;

  /* Neutros */
  --ink:          #182230;
  --body:         #495567;
  --muted:        #7a8696;
  --line:         #e6eaf0;
  --bg:           #ffffff;
  --bg-soft:      #f5f7fa;
  --bg-softer:    #eef2f7;
  --white:        #ffffff;

  /* Tipografia */
  --font-base: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Raio de borda */
  --radius-sm:  10px;
  --radius:     16px;
  --radius-lg:  24px;
  --radius-pill: 999px;

  /* Elevação */
  --shadow-xs: 0 1px 2px rgba(16, 24, 40, .06);
  --shadow-sm: 0 4px 12px rgba(16, 24, 40, .08);
  --shadow:    0 12px 28px rgba(16, 24, 40, .10);
  --shadow-lg: 0 24px 48px rgba(16, 24, 40, .14);
  --shadow-brand: 0 14px 30px rgba(251, 140, 8, .30);

  /* Transição */
  --t-fast: .18s ease;
  --t:      .28s cubic-bezier(.4, 0, .2, 1);

  /* Layout */
  --nav-h: 74px;
  --container-max: 1200px;

  /* Gradientes */
  --grad-brand: linear-gradient(135deg, #fcba3d 0%, #fb8c08 55%, #c4500a 100%);
  --grad-navy:  linear-gradient(135deg, var(--navy-700) 0%, var(--navy) 100%);
}