/* ============================================================
   NUTRICOR — global.css
   Variáveis de cor, reset, tipografia e classes base.
   ✏️ EDITAR CORES: altere os valores abaixo no :root e o site
      inteiro muda automaticamente.
   ============================================================ */

:root {
  /* --- Paleta extraída da logo (verde saúde) --- */
  --primary:       #1FA463;   /* verde principal da logo */
  --primary-deep:  #147A48;   /* verde escuro */
  --primary-pale:  #E8F5EE;   /* verde quase branco (fundos suaves) */
  --secondary:     #0E3B2C;   /* verde-marinho profundo (seções escuras premium) */
  --accent:        #D4A24E;   /* dourado discreto (autoridade/premium) */
  --dark:          #0A1F18;   /* quase preto esverdeado */
  --cream:         #FAFBF9;   /* off-white quente (fundo geral) */
  --white:         #ffffff;

  --text:          #182A22;   /* texto principal */
  --text-mid:      #4A5B53;   /* texto secundário */
  --text-light:    #8A988F;   /* texto de apoio */

  --line:          #E4EAE6;   /* bordas/divisores suaves */
  --radius:        18px;
  --radius-sm:     12px;
  --shadow:        0 18px 50px -22px rgba(14,59,44,.30);
  --shadow-soft:   0 10px 30px -16px rgba(14,59,44,.22);
  --maxw:          1200px;
}

/* --- Reset --- */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  font-family: 'DM Sans', system-ui, -apple-system, sans-serif;
  background: var(--cream);
  color: var(--text);
  line-height: 1.6;
  overflow-x: hidden;
  font-weight: 400;
}

img { display: block; max-width: 100%; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }

/* --- Container utilitário --- */
.wrap { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 24px; }

/* --- Títulos de seção --- */
.sec-label {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .78rem; font-weight: 500; letter-spacing: .18em;
  text-transform: uppercase; color: var(--primary-deep);
  margin-bottom: 18px;
}
.sec-label::before {
  content: ''; width: 26px; height: 2px; background: var(--primary);
  display: inline-block;
}
.sec-title {
  font-family: 'Playfair Display', serif;
  font-size: clamp(1.9rem, 4vw, 3rem);
  font-weight: 500; line-height: 1.12; color: var(--secondary);
  letter-spacing: -.01em;
}
.sec-title em {
  font-style: italic; color: var(--primary-deep);
}
.sec-script {
  font-family: 'Dancing Script', cursive;
  font-weight: 600; color: var(--primary);
  font-size: clamp(1.6rem, 3vw, 2.2rem);
}
.sec-body {
  color: var(--text-mid); font-size: 1.05rem; max-width: 56ch;
  margin-top: 16px;
}

/* --- Seção genérica (espaçamento vertical padrão) --- */
.section { padding: 92px 0; }
.section--tight { padding: 64px 0; }

/* --- Fundo escuro premium reutilizável --- */
.bg-dark { background: var(--secondary); color: var(--white); }
.bg-dark .sec-title { color: var(--white); }
.bg-dark .sec-title em { color: var(--accent); }
.bg-dark .sec-body { color: rgba(255,255,255,.78); }
.bg-dark .sec-label { color: var(--accent); }
.bg-dark .sec-label::before { background: var(--accent); }

/* --- Fade-in (estados; animação detalhada em animations.css) --- */
.fi { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s ease; }
.fi.v { opacity: 1; transform: none; }
.fi-d1 { transition-delay: .08s; }
.fi-d2 { transition-delay: .16s; }
.fi-d3 { transition-delay: .24s; }
.fi-d4 { transition-delay: .32s; }

/* --- Acessibilidade: respeitar redução de movimento --- */
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
  .fi { opacity: 1; transform: none; }
  html { scroll-behavior: auto; }
}

@media (max-width: 960px) { .section { padding: 70px 0; } }
@media (max-width: 600px) { .wrap { padding: 0 18px; } .section { padding: 56px 0; } }
