/* Mitic · Preguntas "Pregúntale por WhatsApp" (2026-10-18). Lista de preguntas agrupadas + ventana de chat con la
   respuesta elegida (mitic-faq.js); franja "Sé de los primeros" debajo. Tokens de marca: claro y oscuro. */
.fq-cab{text-align:center;max-width:760px;margin:0 auto 36px}
.fq-cab .eyebrow{justify-content:center}
.fq-cab h2{font-size:clamp(30px,2.2vw + 16px,46px);margin:0 auto}
.fq-cab .lead{margin:12px auto 0}
.fq-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,56px);align-items:start;max-width:1120px;margin:0 auto}

/* lista */
.fq-grupo{margin:22px 0 8px;font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--tinta-3)}
.fq-grupo:first-child{margin-top:0}
.fq-ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.fq-q{width:100%;text-align:left;font:inherit;font-size:15px;font-weight:600;line-height:1.35;padding:12px 16px;border-radius:14px;cursor:pointer;
  border:1px solid var(--borde);background:var(--superficie);color:var(--tinta);transition:border-color .2s,background .2s,transform .2s var(--ease-out)}
.fq-q:hover{border-color:var(--borde-fuerte);transform:translateX(3px)}
.fq-q:focus-visible{outline:3px solid var(--foco);outline-offset:2px}
.fq-q[aria-expanded="true"]{background:#1A1816;color:#F2EFE9;border-color:#1A1816;box-shadow:0 10px 24px -14px rgba(26,24,22,.7)}

/* chat */
.fq-chat{position:sticky;top:88px;border-radius:24px;overflow:hidden;border:1px solid var(--borde);box-shadow:0 30px 60px -30px rgba(26,24,22,.45);background:var(--superficie)}
.fq-top{display:flex;align-items:center;gap:12px;padding:14px 18px;background:#1A1816;color:#F2EFE9}
.fq-av{width:40px;height:40px;border-radius:50%;background:#F2EFE9;display:grid;place-items:center;flex:0 0 auto}
.fq-av svg{width:28px;height:28px}
.fq-top b{display:block;font-size:15.5px}
.fq-top small{display:block;font-size:12.5px;opacity:.72}
.fq-cuerpo{position:relative;min-height:360px;padding:22px 18px;display:flex;flex-direction:column;justify-content:flex-end;
  background-color:var(--fondo);background-image:radial-gradient(circle at 1px 1px,var(--borde) 1px,transparent 0);background-size:20px 20px}
.fq-msg{display:flex;flex-direction:column;gap:10px}
.fq-msg[hidden]{display:none}
.fq-b{margin:0;max-width:85%;padding:11px 15px;border-radius:18px;font-size:15px;line-height:1.55;box-shadow:0 1px 1px rgba(26,24,22,.08)}
.fq-yo{align-self:flex-end;background:#C2410C;color:#fff;border-bottom-right-radius:6px;font-weight:600}
.fq-mitic{align-self:flex-start;background:var(--superficie);color:var(--tinta);border:1px solid var(--borde);border-bottom-left-radius:6px}
.fq-de{display:block;font-family:var(--f-mono);font-size:11.5px;font-weight:600;color:var(--marca-txt);margin-bottom:3px}
.fq-escribe{display:none;align-self:flex-start;gap:5px;padding:13px 16px;border-radius:18px;border-bottom-left-radius:6px;background:var(--superficie);border:1px solid var(--borde);margin-top:10px}
.fq-escribe i{width:7px;height:7px;border-radius:50%;background:var(--tinta-3);animation:fq-punto 1s ease-in-out infinite}
.fq-escribe i:nth-child(2){animation-delay:.15s}.fq-escribe i:nth-child(3){animation-delay:.3s}
@keyframes fq-punto{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.fq-chat.escribiendo .fq-escribe{display:inline-flex}
.fq-chat.escribiendo .fq-mitic{display:none}
html.fx-on .fq-msg:not([hidden]) .fq-b{animation:fq-entra .35s var(--ease-out) both}
html.fx-on .fq-msg:not([hidden]) .fq-mitic{animation-delay:.05s}
@keyframes fq-entra{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
.fq-pie{display:flex;align-items:center;gap:10px;padding:12px;border-top:1px solid var(--borde);background:var(--superficie)}
.fq-otra{flex:1;min-width:0;font-size:14.5px;font-weight:600;color:var(--tinta-2)}
.fq-pie .btn{flex:0 0 auto}

/* "Sé de los primeros" */
.fq-prim{max-width:1120px;margin:40px auto 0;padding:22px 26px;border-radius:20px;background:#1A1816;color:#F2EFE9;display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px 32px;align-items:center}
.fq-prim h3{margin:0;font-size:17px;max-width:14ch;color:#FB923C}
.fq-prim ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.fq-prim li{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.5;color:rgba(242,239,233,.82)}
.fq-prim li b{color:#F2EFE9}
.fq-prim .ic{width:20px;height:20px;flex:0 0 auto;color:#FB923C;--ic-acc:#FB923C;margin-top:1px}

@media(max-width:920px){
  /* acordeón: preguntas completas en columna; la ventana con la respuesta se inserta bajo la elegida (mitic-faq.js) */
  .fq-grid{grid-template-columns:1fr}
  .fq-chat{position:static;margin:8px 0 6px;border-radius:18px}
  .fq-top{display:none}
  .fq-cuerpo{min-height:0;padding:14px 12px}
  .fq-yo{display:none}
  .fq-b{max-width:100%}
  .fq-q[aria-expanded="true"]{border-radius:14px 14px 6px 6px}
  .fq-prim{grid-template-columns:1fr}
  .fq-prim h3{max-width:none}
  .fq-prim ul{grid-template-columns:1fr;gap:12px}
}
@media(max-width:520px){
  .fq-pie{flex-direction:column;align-items:stretch}
  .fq-pie .btn{width:100%;justify-content:center}
}
@media(prefers-reduced-motion:reduce){.fq-escribe i{animation:none}}
.fq-q{scroll-margin-top:96px}   /* la cabecera fija (~72 px) no tapa la pregunta abierta */
