/* ============================================================
   variables.css — Design Tokens · Quality Soluções
   WgDk Web Solutions · Douglas & Vagner
   ============================================================ */

:root {

  /* ── Cores ── */
  --clr-navy:        #0A1531;
  --clr-dark:        #0D1B2A;
  --clr-dark-card:   #111f30;
  --clr-blue:        #234791;
  --clr-blue-hover:  #1d3a7a;
  --clr-orange:      #EE7F25;
  --clr-orange-hover:#d96e1a;
  --clr-green-wa:    #25D366;
  --clr-green-wa-hv: #1fb055;
  --clr-gold:        #EEB825;

  /* ── Texto ── */
  --clr-text-white: #FFFFFF;
  --clr-text-light: #E2E8F0;
  --clr-text-muted: #8895A7;

  /* ── Bordas ── */
  --clr-border:        rgba(255,255,255,0.08);
  --clr-border-orange: rgba(238,127,37,0.35);

  /* ── Tipografia ── */
  --font-title: 'Tenor Sans', Georgia, serif;
  --font-body:  'Montserrat', system-ui, sans-serif;

  /* ── Escala fluid ── */
  --fs-xs:   0.75rem;
  --fs-sm:   0.875rem;
  --fs-base: 1rem;
  --fs-md:   1.125rem;
  --fs-lg:   1.25rem;
  --fs-xl:   1.5rem;
  --fs-2xl:  2rem;
  --fs-hero: clamp(2.6rem, 5.5vw, 4.8rem);

  /* ── Espaçamentos ── */
  --sp-xs: 0.5rem;
  --sp-sm: 1rem;
  --sp-md: 1.5rem;
  --sp-lg: 2rem;
  --sp-xl: 3rem;
  --sp-2xl: 3rem;
  --sp-section: clamp(4rem, 8vw, 7rem);

  /* ── Layout ── */
  --container-max: 1200px;
  --container-pad: clamp(1rem, 4vw, 2rem);
  --header-h: 72px;

  /* ── Radii ── */
  --r-sm:   6px;
  --r-md:   12px;
  --r-lg:   16px;
  --r-xl:   16px;
  --r-pill: 50px;

  /* ── Sombras ── */
  --shadow-card:   0 4px 24px rgba(0,0,0,0.35);
  --shadow-orange: 0 8px 30px rgba(238,127,37,0.45);
  --shadow-wa:     0 4px 20px rgba(37,211,102,0.5);

  /* ── Transições ── */
  --t-fast:   0.2s ease;
  --t-normal: 0.3s ease;
}
