/* Fonte e base */
body {
  font-family: "Nunito", sans-serif;
  background-color: #fef9f3;
}

/* Header */
header {
  transition: all 0.3s ease;
  padding-top: 6px;
  padding-bottom: 5px;
}

/* Hero */
.hero-bg {
  background: linear-gradient(135deg, #ffd6e0 0%, #c4f2f1 100%);
}

/* Cards livro / genéricos */
.book-card { transition: all 0.3s ease; }
.book-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}

/* Navegação ativa */
.nav-link { position: relative; }
.nav-link.active { color: #ff7aa8; font-weight: 700; }
.nav-link.active::after { width: 100%; }

/* Sub-linha hover nos links do menu */
.nav-link:after {
  content: "";
  position: absolute;
  width: 0; height: 2px; bottom: 0; left: 0;
  background-color: #ff7aa8;
  transition: width 0.3s ease;
}
.nav-link:hover:after { width: 100%; }

/* Footer com nuvem ao fundo */
footer::before {
  content: "";
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  background-image: url("/image/webp/nuvem.webp");
  background-size: cover;
  background-position: center;
  opacity: 0.2;
  z-index: 0;
  pointer-events: none;
}
footer > * { position: relative; z-index: 1; }

/* Mascote / elementos flutuando */
.mascot { animation: float 3s ease-in-out infinite; }
@keyframes float {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
}

/* Ícones de features */
.feature-icon {
  width: 80px; height: 80px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background-color: white;
  box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

/* ====== Partners Carousel ====== */
.partners-section { position: relative; background-color: #fef9f3; }
.partners-container { max-width: 1200px; margin: 0 auto; padding: 0 1rem; }
.partners-carousel {
  position: relative; overflow: hidden; padding: 2rem 0;
  -webkit-user-select: none; user-select: none;
}
.partners-carousel::before,
.partners-carousel::after {
  content: ""; position: absolute; top: 0; bottom: 0; width: 150px; z-index: 2;
}
.partners-carousel::before {
  left: 0;
  background: linear-gradient(to right, rgba(254,249,243,1) 0%, rgba(254,249,243,0) 100%);
}
.partners-carousel::after {
  right: 0;
  background: linear-gradient(to left, rgba(254,249,243,1) 0%, rgba(254,249,243,0) 100%);
}
.partners-track {
  display: flex; width: max-content;
  animation: scroll 20s linear infinite;
  will-change: transform; touch-action: none;
}
@keyframes scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.partners-carousel:hover .partners-track,
.partners-carousel.dragging .partners-track {
  animation-play-state: paused;
}
.partner-logo {
  flex-shrink: 0; width: 220px; height: 120px; margin: 0 15px;
  display: flex; align-items: center; justify-content: center;
  background: white; border-radius: 12px; padding: 1rem;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  transition: all 0.3s ease;
}
.partner-logo:hover { transform: scale(1.05); box-shadow: 0 8px 20px rgba(0,0,0,0.1); }
.partner-logo img { max-width: 90%; max-height: 70px; object-fit: contain; }

/* Botões com hover/press */
.hover-btn { transition: all 0.2s ease; transform-origin: center center; position: relative; overflow: hidden; }
.hover-btn:after {
  content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  background-color: rgba(255,255,255,0.15); border-radius: 9999px;
  transform: scale(0); transition: transform 0.5s ease; z-index: 0;
}
.hover-btn:hover:after { transform: scale(1.8); }
.hover-btn:hover { transform: translateY(-2px); }
.hover-btn:active { transform: translateY(1px) scale(0.98); }
.btn-press { transition: all 0.2s ease; }
.btn-press:active { transform: translateY(2px); }

/* Reveal/scroll animations */
.reveal { opacity: 0; transform: translateY(25px); transition: all 0.6s cubic-bezier(0.25,0.46,0.45,0.94); }
.reveal.active { opacity: 1; transform: translateY(0); }

.section-space { padding: 5rem 0; }

/* Cards animados */
.card-animate {
  opacity: 0; transform: translateY(20px) scale(0.95) rotateY(10deg);
  transform-style: preserve-3d; perspective: 1000px;
  transition: all 0.6s cubic-bezier(0.25,0.46,0.45,0.94);
  will-change: transform, opacity, box-shadow;
}
.card-animate.active { opacity: 1; transform: translateY(0) scale(1) rotateY(0); }
.card-animate.delay-100 { transition-delay: 0.1s; }
.card-animate.delay-200 { transition-delay: 0.2s; }
.card-animate.delay-300 { transition-delay: 0.3s; }
.card-animate.delay-400 { transition-delay: 0.4s; }
.card-animate:hover {
  transform: translateY(-5px) scale(1.03) rotateY(0);
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);
}

/* Como adotar */
.how-to-adopt-card { transition: all 0.3s ease; height: 100%; }
.how-to-adopt-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);
}

/* Cores e ondas do footer */
:root {
  --top-bg: rgb(249 250 251 / var(--tw-bg-opacity, 1));
  --footer-bg: #1f2937;
}
.wave-divider { position: relative; height: 120px; overflow: hidden; pointer-events: none; }
.wave-top-inverted { position: relative; z-index: 3; margin-bottom: -60px; }
.wave { position: absolute; top: 0px; left: 0; width: 350%; height: 130%; }
.wave1 { animation: waveMove 12s linear infinite; }
.wave2 { animation: waveMove 20s linear infinite reverse; }
.wave-fill { fill: var(--top-bg); }
@keyframes waveMove { from { transform: translateX(0); } to { transform: translateX(-50%); } }
footer { position: relative; background-color: var(--footer-bg); z-index: 1; }
footer::before { z-index: 0; }

/* Acessibilidade (reduzir movimento) */
@media (prefers-reduced-motion: reduce) {
  .wave1, .wave2 { animation: none; transform: none; }
}

/* Micro interação personagem/btn (se usado) */
.hover-btn:hover + .personagem { transform: translateY(-5px) scale(1.1); }
.personagem { transition: all 0.3s ease; }
