/* Correcciones base para asegurar la integración correcta de Tailwind */
body {
    background-color: #050505;
    margin: 0;
    padding: 0;
}

/* Lógica y animaciones del Acordeón FAQ 
  Se usa CSS tradicional para garantizar transiciones suaves que las clases
  utilitarias en bruto a veces no manejan tan limpiamente.
*/
.faq-answer {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s ease-out, padding 0.3s ease-out;
    padding-top: 0;
    padding-bottom: 0;
}

.faq-answer > p {
    overflow: hidden;
}

/* Clases dinámicas manejadas por JavaScript */
.faq-item.active .faq-answer {
    grid-template-rows: 1fr;
    padding-bottom: 1.5rem;
}

.faq-item.active .faq-icon {
    transform: rotate(45deg);
    background-color: #eab308; /* Yellow-500 de Tailwind */
    color: #000;
}