/* ============================================================
   365 Receitas Sem Açúcar, Sem Glúten e Sem Lactose
   Tokens de marca + animações (complementa o Tailwind)
   ============================================================ */

:root {
  --brand-green: #15803d;
  --brand-green-deep: #0f3d22;
  --brand-orange: #ea580c;
  --brand-cream: #fdf6ec;

  --background: #fbf8f3;
  --foreground: #1c1917;
  --muted-foreground: #78716c;
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: "Poppins", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  background-color: var(--background);
  color: var(--foreground);
}

/* CTA com pulsação suave — usado em todos os botões verdes */
@keyframes pulse-cta {
  0%, 100% { transform: scale(1); box-shadow: 0 10px 25px -10px rgba(22, 163, 74, 0.7); }
  50%      { transform: scale(1.035); box-shadow: 0 18px 35px -12px rgba(22, 163, 74, 0.85); }
}

.animate-pulse-cta {
  animation: pulse-cta 2.2s ease-in-out infinite;
  cursor: pointer;
}

.animate-pulse-cta:hover {
  animation-play-state: paused;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .animate-pulse-cta { animation: none; }
}

/* Carrossel de depoimentos: scroll horizontal com snap */
.testimonial-track {
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
  cursor: grab;
}

.testimonial-track::-webkit-scrollbar { display: none; }
.testimonial-track.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.testimonial-track > * { scroll-snap-align: start; }

/* Acordeão do FAQ */
.faq-panel {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows 300ms ease-in-out, opacity 300ms ease-in-out;
}

.faq-panel.is-open {
  grid-template-rows: 1fr;
  opacity: 1;
}

.faq-icon { transition: transform 300ms ease; }
.faq-item.is-open .faq-icon {
  transform: rotate(180deg);
  background-color: var(--brand-orange);
  color: #fff;
}
.faq-item.is-open .faq-question { color: var(--brand-orange); }
