/* =====================================================================
   ePrilux · Preguntas frecuentes: un solo estilo en toda la web (Karen, 26/10/2026)
   Se usa poniendo la clase «epx-faq» en el campo «Clases CSS» de un acordeón anidado de Elementor.
   Es el estilo de las categorías: número 01 pequeño (azul al abrir), pregunta fina en navy, líneas finas
   y cuadrado +/− (azul al abrir). Sustituye a los estilos sueltos de las plantillas 3360 y 295 y de la
   página de preguntas frecuentes (5049). El acordeón de categorías hecho por código (.epx-cat.epx-faq,
   en 5750) se ve igual.
   ===================================================================== */

.epx-faq .e-n-accordion {
  counter-reset: epxfaq;
  border-top: 1px solid #06163d;
}
.epx-faq .e-n-accordion-item {
  counter-increment: epxfaq;
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #e4e6e9 !important;
  border-radius: 0 !important;
  background: transparent !important;
}
.epx-faq .e-n-accordion-item-title {
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 12px;
  padding: 24px 20px !important;
  border: 0 !important;
  background: transparent !important;
}
.epx-faq .e-n-accordion-item-title::before {
  content: counter(epxfaq, decimal-leading-zero);
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .12em;
  color: #8a909e;
}
.epx-faq .e-n-accordion-item[open] .e-n-accordion-item-title::before { color: #23a7d6; }
/* Preguntas escritas a mano en páginas de HTML (legales y de servicio, 3/11/2026): mismo marcado que el acordeón de
   Elementor, pero sin su CSS, así que hay que quitar la flecha del navegador y poner el cursor. */
.epx-faq summary.e-n-accordion-item-title { list-style: none; cursor: pointer; }
.epx-faq summary.e-n-accordion-item-title::-webkit-details-marker { display: none; }
/* Siempre número, pregunta y cuadrado, aunque el acordeón tenga el icono configurado «al principio» */
.epx-faq .e-n-accordion-item-title-header { order: 2; min-width: 0; }
.epx-faq .e-n-accordion-item-title-icon { order: 3; }
.epx-faq .e-n-accordion-item-title-text {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 15.5px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  color: #06163d !important;
}

/* Cuadrado +/− (2 px como mucho), dibujado aquí en lugar de los iconos de Elementor */
.epx-faq .e-n-accordion-item-title-icon {
  position: relative;
  width: 28px;
  height: 28px;
  border: 1px solid #e4e6e9;
  border-radius: 2px;
  background: #fff;
  transition: background .25s, border-color .25s;
}
.epx-faq .e-n-accordion-item-title-icon > span { display: none !important; }
.epx-faq .e-n-accordion-item-title-icon::before,
.epx-faq .e-n-accordion-item-title-icon::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 10px;
  height: 1.5px;
  background: #06163d;
  transform: translate(-50%, -50%);
}
.epx-faq .e-n-accordion-item-title-icon::after { transform: translate(-50%, -50%) rotate(90deg); transition: transform .25s; }
.epx-faq .e-n-accordion-item-title:hover .e-n-accordion-item-title-icon { border-color: #06163d; }
.epx-faq .e-n-accordion-item[open] .e-n-accordion-item-title-icon { background: #23a7d6; border-color: #23a7d6; }
.epx-faq .e-n-accordion-item[open] .e-n-accordion-item-title-icon::before,
.epx-faq .e-n-accordion-item[open] .e-n-accordion-item-title-icon::after { background: #fff; }
.epx-faq .e-n-accordion-item[open] .e-n-accordion-item-title-icon::after { transform: translate(-50%, -50%) rotate(0deg); }

/* Respuesta */
.epx-faq .e-n-accordion-item > :is([role="region"], .e-con) {
  padding: 0 60px 26px 76px !important;
  border: 0 !important;
  background: transparent !important;
}
.epx-faq .e-n-accordion-item > :is([role="region"], .e-con) :is(p, li, .elementor-widget-text-editor, .e-paragraph-base) {
  margin: 0;
  font-family: 'Montserrat', sans-serif;
  font-size: 14.5px !important;
  font-weight: 300 !important;
  line-height: 1.9 !important;
  color: #5b6270 !important;
}
.epx-faq .e-n-accordion-item > :is([role="region"], .e-con) :is(p, li) + :is(p, ul, ol) { margin-top: 10px; }
.epx-faq .e-n-accordion-item > :is([role="region"], .e-con) a { color: #06163d; text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 620px) {
  .epx-faq .e-n-accordion-item-title { grid-template-columns: 30px minmax(0, 1fr) 28px; padding: 20px 4px !important; }
  .epx-faq .e-n-accordion-item > :is([role="region"], .e-con) { padding: 0 8px 22px 46px !important; }
}

/* ---------- Cabecera de preguntas hecha con bloques de Elementor (26/10/2026) ----------
   La de la tienda (plantilla 499) ya no es el atajo [epx_tienda_faq]: son bloques con las clases del componente
   de categorías (epx-cat epx-faq › ew › cab / fl). Aquí, lo que cambia respecto a ese HTML: la caja de ayuda con
   icono, título, texto y correo, y la columna de preguntas, cuya raya de arriba ya la pone el acordeón. */
.epx-cat.epx-faq .ew.e-con { display: grid; }
.epx-cat.epx-faq .cab.e-con, .epx-cat.epx-faq .fl.e-con { min-width: 0; }
.epx-cat.epx-faq .fl.e-con { border-top: 0; }
.epx-cat.epx-faq .elementor-heading-title { text-transform: none; }
.epx-cat.epx-faq .cab .tag .elementor-heading-title { font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; }
.epx-cat.epx-faq .cab h2.elementor-heading-title b { font-weight: 600; }
.epx-cat.epx-faq .cab .intro p { margin: 0; }
.epx-cat.epx-faq .ayuda.e-con { gap: 16px; }
.epx-cat.epx-faq .ayuda .elementor-icon { display: grid; place-items: center; width: 44px; height: 44px; background: var(--blue); border-radius: 2px; font-size: 20px; color: #fff; }
.epx-cat.epx-faq .ayuda .elementor-icon svg { width: 20px; height: 20px; fill: #fff; }
.epx-cat.epx-faq .ayuda .elementor-heading-title { margin: 0; font-family: 'Montserrat', sans-serif; font-size: 15px; font-weight: 500; line-height: 1.4; color: var(--navy); }
.epx-cat.epx-faq .ayuda .elementor-widget-text-editor { margin-top: 4px; font-size: 12.5px; font-weight: 300; line-height: 1.6; color: #5b6270; }
.epx-cat.epx-faq .ayuda .elementor-widget-text-editor p { margin: 0; }
.epx-cat.epx-faq .ayuda .ayuda-mail .elementor-heading-title { font-size: 13.5px; font-weight: 600; }
.epx-cat.epx-faq .ayuda .ayuda-mail a { margin-top: 12px; }
/* Las reglas del bloque hecho por código (.epx-cat.epx-faq details p, en 5750) daban a los párrafos de la respuesta
   otro margen igual al de la respuesta: con el acordeón de Elementor, solo el de la respuesta. */
.epx-cat.epx-faq details.e-n-accordion-item p { padding: 0; }

/* Sección de preguntas sin ninguna pregunta (ficha sin preguntas rellenas): fuera, en vez de un título con el hueco
   vacío (26/10/2026, ficha 002059). */
.l-section:has(.elementor-widget-n-accordion.epx-faq):not(:has(.e-n-accordion-item)) { display: none !important; }