/* Proto&Go! — preguntas frecuentes con buscador (/faqs/ y Recursos). Hereda tokens de pg.css. */

/* caja de búsqueda */
.fq-box{display:flex;align-items:center;gap:14px;height:68px;padding:0 22px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px var(--line-strong),0 24px 50px -36px rgba(30,32,35,.45);cursor:text;transition:box-shadow .35s var(--ease)}
.fq-box:focus-within{box-shadow:inset 0 0 0 2px var(--ink),0 30px 60px -34px rgba(30,32,35,.5)}
.fq-box svg{width:22px;height:22px;flex:none;stroke:var(--ink);fill:none;stroke-width:1.8}
.fq-box input{flex:1;min-width:0;height:100%;border:0;background:none;outline:none;font-family:var(--display);font-variation-settings:'wdth' 108;font-weight:500;font-size:clamp(1.05rem,1.6vw,1.35rem);letter-spacing:-.01em}
.fq-box input::placeholder{color:#8b9097}
.fq-box input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;width:18px;height:18px;cursor:pointer;background:no-repeat center/12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M1 1l10 10M11 1L1 11' stroke='%231e2023' stroke-width='1.6'/%3E%3C/svg%3E")}
.fq-box kbd{font-family:var(--mono);font-size:.7rem;color:var(--steel);padding:4px 9px;border-radius:5px;box-shadow:inset 0 0 0 1px var(--line-strong)}
.fq-box.sm{height:52px;padding:0 18px;width:100%}
.fq-box.sm input{font-size:1rem;font-family:var(--body);font-weight:500}
.fq-box.sm svg{width:18px;height:18px}
.fq-count{font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--steel)}
mark{background:var(--orange-soft);color:inherit;box-shadow:0 2px 0 var(--orange);border-radius:2px;padding:0 1px}

/* lista de preguntas */
.fq-list{border-top:1px solid var(--line-strong)}
.fq-item{border-bottom:1px solid var(--line)}
.fq-item[hidden]{display:none}
.fq-item summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:1fr 30px;gap:20px;align-items:center;padding:18px 4px 18px 0;transition:padding .35s var(--ease)}
.fq-item summary::-webkit-details-marker{display:none}
.fq-item summary:hover{padding-left:8px}
.fq-item summary:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.fq-q{font-weight:600;font-size:clamp(1rem,1.2vw,1.1rem);line-height:1.35;text-wrap:pretty}
.fq-ic{position:relative;width:30px;height:30px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line-strong);transition:background .3s,box-shadow .3s,transform .45s var(--ease)}
.fq-ic::before,.fq-ic::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:1.5px;background:currentColor;transform:translate(-50%,-50%)}
.fq-ic::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .45s var(--ease)}
.fq-item summary:hover .fq-ic{box-shadow:inset 0 0 0 1px var(--ink)}
.fq-item[open] .fq-ic{background:var(--ink);color:var(--paper);box-shadow:none;transform:rotate(180deg)}
.fq-item[open] .fq-ic::after{transform:translate(-50%,-50%) rotate(0)}
.fq-a{padding:0 60px 22px 0;color:var(--ink-2);font-size:.98rem;line-height:1.6;max-width:78ch}
.fq-a p+p,.fq-a p+ul,.fq-a ul+p{margin-top:10px}
.fq-a ul{margin:8px 0 0;padding-left:1.1em}
.fq-a li{margin:4px 0}
.fq-a li::marker{color:var(--orange)}
.fq-item[open] .fq-a{animation:fq-in .45s var(--ease)}
@keyframes fq-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.fq-empty{padding:36px 0;border-bottom:1px solid var(--line)}
.fq-empty[hidden]{display:none}
.fq-empty b{display:block;font-family:var(--display);font-variation-settings:'wdth' 110;font-weight:600;font-size:1.3rem;margin-bottom:6px}
.fq-empty p{color:var(--ink-2)}

/* ---------- página de preguntas frecuentes ---------- */
.fq-hero{padding-bottom:clamp(20px,3vw,40px)}
.fq-hero h1{max-width:18ch}
.fq-find{display:flex;flex-direction:column;gap:12px;margin-top:clamp(26px,3.4vw,44px);max-width:760px}
.fq-find .fq-count{padding-left:26px}
.fq-try{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:22px;max-width:1080px}
.fq-try .mono{margin-right:6px}
.fq-try .chip{padding:8px 13px;font-size:.84rem;cursor:pointer}
.fq-body{padding-top:clamp(28px,4vw,56px)}
.fq-layout{display:grid;grid-template-columns:minmax(210px,3fr) minmax(0,9fr);gap:clamp(28px,5vw,80px);align-items:start}
.fq-nav{position:sticky;top:92px;display:flex;flex-direction:column;border-top:1px solid var(--line-strong)}
.fq-nav button{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 10px 10px 0;border-bottom:1px solid var(--line);font-size:.92rem;text-align:left;color:var(--ink-2);transition:padding .3s var(--ease),color .3s}
.fq-nav button b{font-family:var(--mono);font-size:.66rem;font-weight:500;color:var(--steel)}
.fq-nav button:hover{padding-left:6px;color:var(--ink)}
.fq-nav button.is-zero,.fq-chips button.is-zero{opacity:.38}
.fq-nav button[aria-pressed="true"]{color:var(--ink);font-weight:600;padding-left:12px;box-shadow:inset 3px 0 0 var(--orange)}
.fq-nav button[aria-pressed="true"] b{color:#9c5800}
.fq-groups{display:flex;flex-direction:column;gap:clamp(48px,6vw,88px)}
.fq-group[hidden]{display:none}
.fq-ghead{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:baseline;margin-bottom:18px}
.fq-ghead .n{font-family:var(--mono);font-size:.7rem;color:#9c5800;letter-spacing:.08em}
.fq-ghead h2{font-size:clamp(1.6rem,2.8vw,2.4rem)}
.fq-ghead .mono{white-space:nowrap}

/* ---------- bloque de Recursos ---------- */
.rsec-faq .head-2 .side{gap:14px;align-items:stretch;width:100%}
.rsec-faq .head-2 .side .link{align-self:flex-start}
.fq-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.fq-chips{display:flex;flex-wrap:wrap;gap:6px}
.fq-chips button{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 15px;border-radius:999px;font-size:.88rem;font-weight:500;box-shadow:inset 0 0 0 1px var(--line-strong);transition:background .3s,color .3s,box-shadow .3s}
.fq-chips button b{font-family:var(--mono);font-size:.64rem;font-weight:500;color:var(--steel)}
.fq-chips button:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.fq-chips button[aria-pressed="true"]{background:var(--ink);color:var(--paper);box-shadow:none}
.fq-chips button[aria-pressed="true"] b{color:var(--paper-on-ink)}
.rsec-faq .fq-more{margin-top:26px}
.rsec-faq .fq-more[hidden]{display:none}

@media (max-width:900px){
  .fq-layout{grid-template-columns:1fr}
  .fq-nav{top:60px;z-index:4;flex-direction:row;overflow-x:auto;gap:6px;border:0;margin-inline:calc(-1*clamp(20px,4vw,64px));padding:10px clamp(20px,4vw,64px);background:rgba(246,246,244,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);scrollbar-width:none}
  .fq-nav::-webkit-scrollbar{display:none}
  .fq-nav button{flex:none;border:0;padding:8px 13px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-strong);white-space:nowrap}
  .fq-nav button:hover{padding-left:13px}
  .fq-nav button[aria-pressed="true"]{background:var(--ink);color:var(--paper);box-shadow:none;padding-left:13px}
  .fq-nav button[aria-pressed="true"] b{color:var(--paper-on-ink)}
}
@media (max-width:560px){
  .fq-box{height:58px;padding:0 16px}
  .fq-box kbd{display:none}
  .fq-a{padding-right:0}
  .fq-ghead{grid-template-columns:auto 1fr}
  .fq-ghead .mono{grid-column:2}
}
@media (prefers-reduced-motion:reduce){.fq-item[open] .fq-a{animation:none}.fq-ic,.fq-ic::after{transition:none}}

/* Buscador común en todas las secciones de FAQ. */
[data-faq-root] [data-faq-item][hidden], [data-faq-root] [data-faq-group][hidden]{display:none!important}
[data-faq-root] .fq-find{margin-bottom:24px;width:100%}
[data-faq-root] .fq-find .fq-count{padding-left:0}
[data-faq-root] .faq-toc button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
[data-faq-root] .faq-toc button[aria-pressed="true"] .n{color:inherit;opacity:.65}
[data-faq-root] .fq-empty{grid-column:1/-1}

/* Misma separación entre temas que en Chapa. */
.fq-adapted-groups > [data-faq-group] + [data-faq-group]{margin-top:22px}
