/* =============================================================================
   FAQ FumandoEspero — accordion estilizado para <details>/<summary>
   Plugin: fe-microdata-kses | Versión: 1.0.0
   Colores marca: dorado #c49a2a · negro #1a1a1a · fondo blanco
   ============================================================================= */

:root {
  --fe-gold:         #c49a2a;
  --fe-gold-h:       #d4aa3a;
  --fe-gold-soft:    rgba(196, 154, 42, .08);
  --fe-gold-border:  rgba(196, 154, 42, .3);
  --fe-dark:         #1a1a1a;
  --fe-text:         #2d2d2d;
  --fe-muted:        #5a5a5a;
  --fe-bg:           #fff;
  --fe-bg-q:         #faf8f4;
  --fe-border:       rgba(0, 0, 0, .09);
  --fe-radius:       6px;
  --fe-trans:        210ms cubic-bezier(.4, 0, .2, 1);
}

/* Contenedor general */
.faq-fumandoespero {
  width: 100%;
  border: 1px solid var(--fe-border);
  border-radius: var(--fe-radius);
  overflow: hidden;
  background: var(--fe-bg);
  margin: 2rem 0;
}

/* Cada item */
.faq-item {
  border-bottom: 1px solid var(--fe-border);
  overflow: hidden;
}
.faq-item:last-child { border-bottom: none; }

/* Pregunta — <summary> */
.faq-question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 20px;
  background: var(--fe-bg-q);
  font-size: 15px;
  font-weight: 600;
  color: var(--fe-dark);
  cursor: pointer;
  list-style: none;
  user-select: none;
  position: relative;
  transition: background var(--fe-trans), color var(--fe-trans);
}
.faq-question::-webkit-details-marker { display: none; }
.faq-question::marker               { display: none; content: ''; }

/* Barra dorada izquierda — aparece al abrir */
.faq-question::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: transparent;
  transition: background var(--fe-trans);
}

/* Icono + / x en dorado */
.faq-question::after {
  content: '';
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background:
    linear-gradient(var(--fe-gold), var(--fe-gold)),
    linear-gradient(var(--fe-gold), var(--fe-gold));
  background-size: 100% 2px, 2px 100%;
  background-position: center;
  background-repeat: no-repeat;
  opacity: .65;
  transition: transform var(--fe-trans), opacity var(--fe-trans);
}

/* Hover */
.faq-question:hover {
  background: var(--fe-gold-soft);
  color: var(--fe-gold);
}
.faq-question:hover::after { opacity: 1; }

/* Foco teclado */
.faq-question:focus-visible {
  outline: 2px solid var(--fe-gold);
  outline-offset: -2px;
  background: var(--fe-gold-soft);
}

/* Estado abierto */
.faq-item[open] > .faq-question {
  background: var(--fe-gold-soft);
  color: var(--fe-gold);
}
.faq-item[open] > .faq-question::before { background: var(--fe-gold); }
.faq-item[open] > .faq-question::after  { transform: rotate(45deg); opacity: 1; }

/* Respuesta */
.faq-answer {
  padding: 14px 20px 18px 23px;
  border-left: 3px solid var(--fe-gold);
  background: var(--fe-bg);
  font-size: 14.5px;
  line-height: 1.65;
  color: var(--fe-muted);
  animation: fe-slide-in 220ms ease;
}
@keyframes fe-slide-in {
  from { opacity: .3; transform: translateY(-5px); }
  to   { opacity: 1;  transform: translateY(0);    }
}
.faq-answer p         { margin: 0; }
.faq-answer p + p     { margin-top: .6em; }
.faq-answer a         { color: var(--fe-gold); text-decoration: underline; text-underline-offset: 3px; }
.faq-answer a:hover   { color: var(--fe-gold-h); }

/* Responsive */
@media (max-width: 600px) {
  .faq-question { padding: 13px 16px; font-size: 14px; }
  .faq-answer   { padding: 12px 16px 16px 19px; font-size: 14px; }
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
  .faq-question,
  .faq-question::before,
  .faq-question::after,
  .faq-answer { transition: none !important; animation: none !important; }
}

/* Impresion: mostrar todas las respuestas */
@media print {
  .faq-item .faq-answer { display: block !important; border-left-color: #c49a2a; }
  .faq-question::after  { display: none; }
  .faq-fumandoespero    { border: 1px solid #ccc; }
}