/* ─── Global Styles — AgroVisão ──────────────────────────────────────
   Estilos base compartilhados por todas as páginas.
   Depende de: variables.css
   ──────────────────────────────────────────────────────────────────── */

/* ─── Base ───────────────────────────────────────────────────────── */

html {
  scroll-behavior: smooth;
}

body {
  background: #FFFFFF;
  color: #1a1a18;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

::selection {
  background: rgba(49, 91, 44, 0.12);
  color: #315B2C;
}

a {
  color: inherit;
}

/* ─── Layout global: primeiro bloco abaixo do header fixo ───────────
   O header é fixed em todas as páginas. Esta regra única garante que o
   primeiro bloco (Hero) de Home/Sobre/Serviços/Projetos/Contato respeite
   a altura do header em cada breakpoint, via --header-offset
   (definida em variables.css e sobrescrita por breakpoint em
   responsive.css). Não criar ajustes equivalentes por página. ────── */

.hero {
  margin-top: var(--header-offset);
}

/* ─── Animação de entrada via scroll ─────────────────────────────── */

[data-animate] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.85s ease, transform 0.85s ease;
}

[data-animate].in {
  opacity: 1;
  transform: translateY(0);
}

[data-animate][data-d="1"] { transition-delay: 0.12s; }
[data-animate][data-d="2"] { transition-delay: 0.24s; }
[data-animate][data-d="3"] { transition-delay: 0.36s; }
[data-animate][data-d="4"] { transition-delay: 0.48s; }

/* ─── Keyframes ──────────────────────────────────────────────────── */

@keyframes mFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes wa-ring {
  0%, 80%, 100% { transform: scale(1);    opacity: 0;    }
  84%            { transform: scale(1);    opacity: 0.65; }
  97%            { transform: scale(1.75); opacity: 0;    }
}

@keyframes scrollLeft {
  from { transform: translateX(0);    }
  to   { transform: translateX(-50%); }
}

@keyframes scrollRight {
  from { transform: translateX(-50%); }
  to   { transform: translateX(0);    }
}
