@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

.font-playfair {
  font-family: 'Playfair Display', serif;
}

.font-montserrat {
  font-family: 'Montserrat', sans-serif;
}

* {
  scroll-behavior: smooth;
}

/* Animación nav mobile */
#mobile-nav .mobile-menu{
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .25s ease, opacity .2s ease;
  opacity: 0;
}
#mobile-nav .mobile-menu > *{ overflow: hidden; }


#mobile-nav[data-open="true"] .mobile-menu{
  grid-template-rows: 1fr;
  opacity: 1;
}

#mobile-nav[data-open="true"] #menu-btn .bar-top{
  transform: translateY(8px) rotate(45deg);
}
#mobile-nav[data-open="true"] #menu-btn .bar-middle{
  opacity: 0;
}
#mobile-nav[data-open="true"] #menu-btn .bar-bottom{
  transform: translateY(-8px) rotate(-45deg);
}

/* Animación del FAQ */
.faq-answer{
  display:grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .3s ease, opacity .25s ease;
  opacity: 0;
}
.faq-answer > *{ overflow: hidden; }

.faq-btn[aria-expanded="true"] .faq-answer{
  grid-template-rows: 1fr;
  opacity: 1;
}