/* ─── Design Tokens — AgroVisão ──────────────────────────────────────
   Fonte única de verdade para cores, tipografia e espaçamentos.
   ──────────────────────────────────────────────────────────────────── */

:root {
  /* ── Paleta principal ────────────────────────────────────────────── */
  --clr-primary:        #315B2C;
  --clr-primary-dark:   #254822;
  --clr-secondary:      #6F8F3A;
  --clr-accent:         #B8D48A;
  --clr-accent-warm:    #DD8758;

  /* ── Neutros ─────────────────────────────────────────────────────── */
  --clr-bg:             #FFFFFF;
  --clr-bg-alt:         #FAFAF8;
  --clr-bg-green-light: #F5F8F3;
  --clr-bg-green-soft:  #EEF6E8;
  --clr-bg-dark:        #131E11;
  --clr-cream:          #F6F4EF;

  /* ── Texto ───────────────────────────────────────────────────────── */
  --clr-text:           #1a1a18;
  --clr-text-body:      #4a4a44;
  --clr-text-muted:     #555550;
  --clr-text-light:     #777772;
  --clr-text-lighter:   #888882;
  --clr-text-faint:     #aaaaaa;

  /* ── Bordas ──────────────────────────────────────────────────────── */
  --border-green-10:    rgba(49, 91, 44, 0.10);
  --border-green-08:    rgba(49, 91, 44, 0.08);
  --border-green-06:    rgba(49, 91, 44, 0.06);

  /* ── WhatsApp ────────────────────────────────────────────────────── */
  --clr-whatsapp:       #25D366;

  /* ── Tipografia ──────────────────────────────────────────────────── */
  --font-serif:  'Cormorant Garamond', serif;
  --font-sans:   'Manrope', sans-serif;

  /* ── Espaçamentos base ───────────────────────────────────────────── */
  --space-xs:   8px;
  --space-sm:   16px;
  --space-md:   24px;
  --space-lg:   40px;
  --space-xl:   64px;
  --space-2xl:  84px;

  /* ── Bordas arredondadas ─────────────────────────────────────────── */
  --radius-sm:  8px;
  --radius-md:  12px;
  --radius-lg:  16px;

  /* ── Sombras ─────────────────────────────────────────────────────── */
  --shadow-card:    0 12px 40px rgba(49, 91, 44, 0.10);
  --shadow-card-sm: 0 4px 24px rgba(49, 91, 44, 0.07);
  --shadow-card-lg: 0 24px 72px rgba(0, 0, 0, 0.12);

  /* ── Transições ──────────────────────────────────────────────────── */
  --transition-fast:   0.20s ease;
  --transition-base:   0.25s ease;
  --transition-nav:    0.45s ease;

  /* ── Footer tokens ──────────────────────────────────────────────── */
  --footer-bg:                   #FFFFFF;
  --footer-text:                 #1a1a18;
  --footer-text-muted:           #666660;
  --footer-text-links:           #555550;
  --footer-text-meta:            #aaaaaa;
  --footer-title:                #315B2C;
  --footer-tagline:              #6F8F3A;
  --footer-border-top:           rgba(49, 91, 44, 0.10);
  --footer-border-grid:          rgba(49, 91, 44, 0.10);
  --footer-icon:                 #315B2C;
  --footer-icon-border:          rgba(49, 91, 44, 0.15);
  --footer-icon-bg-hover:        rgba(49, 91, 44, 0.07);
  --footer-icon-border-hover:    rgba(49, 91, 44, 0.32);
  --footer-hover:                #315B2C;
  --footer-address:              #888882;
  --footer-padding:              80px 0 40px;
  --footer-gap:                  56px;

  /* ── Header fixo — altura real por breakpoint ───────────────────────
     Usada por qualquer página/seção que precise empurrar seu primeiro
     bloco para fora da área do header fixo. Não alterar individualmente
     por página — ajustar aqui propaga para todas. ───────────────────── */
  --header-height-desktop: 95px;
  --header-height-tablet:  79px;
  --header-height-mobile:  79px;

  /* Offset realmente aplicado ao primeiro bloco da página.
     Desktop fica em 0 de propósito: o header é transparente e o Hero
     deve continuar se estendendo por baixo dele (comportamento atual,
     preservado). Em tablet/mobile o header passa a precisar de espaço
     reservado, então o offset assume a altura real do header. */
  --header-offset: 0px;

  /* ── Hero: área segura inferior (mobile) ────────────────────────────
     Padding inferior comum para todos os Heroes no mobile.
     Respeita: respiro visual + onda + proximidade com WhatsApp FAB.
     Alterado apenas aqui, propaga para todas as páginas via CSS global. */
  --hero-safe-area-bottom: 120px;
}
