/* ==========================================================================
   GrowSmart V4 — custom.css
   1) Variáveis CSS da paleta (sempre disponíveis, mesmo sem Tailwind)
   2) Fallback de layout caso o CDN do Tailwind falhe
   3) Animações e overrides que o Tailwind não cobre bem
   ========================================================================== */

:root {
  --gs-red:        #BF0704;
  --gs-red-dark:   #8E0503;
  --gs-red-soft:   #FFF0EF;
  --gs-navy:       #011427;
  --gs-navy-soft:  #02213F;
  --gs-paper:      #FBFAF7;
  --gs-gold:       #F4D58D;
  --gs-gray-100:   #F1EFEA;
  --gs-gray-200:   #D9D5CC;
  --gs-gray-400:   #8A8680;
  --gs-gray-600:   #4A4842;
  --gs-display:    'Bebas Neue', sans-serif;
  --gs-serif:      'Montserrat', sans-serif;
  --gs-sans:       'Inter', system-ui, sans-serif;
}

/* Fallback de layout (ativa só se Tailwind não carregar — note as classes
   .gs-tw-loaded são adicionadas via JS quando Tailwind termina de aplicar) */
body { font-family: var(--gs-sans); background: var(--gs-paper); color: var(--gs-navy); margin: 0; }
h1, h2, h3 { font-family: var(--gs-serif); font-weight: 800; letter-spacing: -0.5px; }
h1 em, h2 em, h3 em { color: var(--gs-red); font-weight: 800; font-style: italic; }

/* Pulse no dot da hero-tag */
.hero-tag span:first-child {
  animation: gsPulse 2s ease-in-out infinite;
}
@keyframes gsPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.4; transform: scale(0.85); }
}

/* Bebas Neue — letra a letra fica colada em tamanhos enormes; aumentar tracking */
.font-display { letter-spacing: 0.03em; }

/* Header com sombra leve quando scrollado */
.navbar.scrolled {
  box-shadow: 0 4px 20px -8px rgba(1, 20, 39, 0.08);
}

/* Mobile menu open state */
#mobile-menu.open { display: block; }

/* Animation de fade-up controlada por IntersectionObserver */
.fade-up {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.fade-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Counter animation: estado inicial */
.stat-number[data-count] { display: inline-block; }

/* Gutenberg blocks — alinhar à paleta navy/red */
.wp-block-quote, .wp-block-pullquote {
  border-left: 3px solid #BF0704;
  padding-left: 1.5rem;
  font-family: 'Montserrat', sans-serif;
  font-style: italic;
  color: #011427;
}
.wp-block-button__link {
  background: #BF0704 !important;
  color: #fff !important;
  border-radius: 4px !important;
  padding: 0.875rem 2rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
}
.wp-block-button__link:hover { background: #8E0503 !important; }

/* Tabela e listas dentro do conteúdo do post */
.prose table { border-collapse: collapse; width: 100%; }
.prose table th, .prose table td { border: 1px solid #D9D5CC; padding: 0.65rem 0.85rem; text-align: left; }
.prose table th { background: #F1EFEA; font-weight: 600; }

/* Comments básico */
.comment-list { list-style: none; padding: 0; }
.comment-list li { padding: 1.25rem 0; border-top: 1px solid #D9D5CC; }
.comment-author { font-weight: 600; color: #011427; }

/* Print */
@media print {
  .site-header, .site-footer, .navbar, #mobile-menu { display: none; }
  body { background: #fff; color: #000; }
}