/* tecomproturopa.es — sistema de movimiento compartido para páginas de ciudad y blog.
   Mismo criterio que la home: scroll-reveal en cascada, hover solo en dispositivos con
   hover real (evita el "hover pegado" al tocar en móvil), y respeto a prefers-reduced-motion. */

@import url('https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap');

/* Misma tipografía de titulares que la home, en toda la web. */
h1, h2, h3, .nav-logo {
  font-family: 'Sora', -apple-system, 'Helvetica Neue', Arial, sans-serif;
}

@media (prefers-reduced-motion: no-preference) {
  .sm-reveal { opacity: 0; transform: translateY(20px); transition: opacity .6s ease, transform .6s ease; }
  .sm-reveal.in { opacity: 1; transform: translateY(0); }

  .sm-stagger > * { opacity: 0; transform: translateY(16px); transition: opacity .5s ease, transform .5s ease; }
  .sm-stagger.in > *:nth-child(1) { opacity: 1; transform: translateY(0); transition-delay: .05s; }
  .sm-stagger.in > *:nth-child(2) { opacity: 1; transform: translateY(0); transition-delay: .13s; }
  .sm-stagger.in > *:nth-child(3) { opacity: 1; transform: translateY(0); transition-delay: .21s; }
  .sm-stagger.in > *:nth-child(4) { opacity: 1; transform: translateY(0); transition-delay: .29s; }
  .sm-stagger.in > *:nth-child(5) { opacity: 1; transform: translateY(0); transition-delay: .37s; }
  .sm-stagger.in > *:nth-child(n+6) { opacity: 1; transform: translateY(0); transition-delay: .45s; }
}

@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
  .hero-cta, .nav-cta, .ctabox a, .compara-cta-btn { transition: transform .2s ease-out, box-shadow .2s ease-out; }
  .hero-cta:hover, .nav-cta:hover, .ctabox a:hover, .compara-cta-btn:hover { transform: translateY(-2px) scale(1.03); box-shadow: 0 10px 24px rgba(0,0,0,0.18); }

  .faq details { transition: box-shadow .2s ease-out, border-color .2s ease-out; }
  .faq details:hover { border-color: #9FE1CB; box-shadow: 0 2px 12px rgba(15,110,86,0.1); }

  .otras a { transition: color .15s ease-out; }
  .otras a:hover { color: #1D9E75; text-decoration: underline; }

  .faq-articulo details { transition: border-color .2s ease-out; }
  .faq-articulo details:hover { border-color: #9FE1CB; }
}