/* ═══════════════════════════════════════════════
   FAQ.CSS — Preguntas frecuentes
   Solo variables de tokens.css; no declara :root.
   ═══════════════════════════════════════════════ */

.faq { max-width:820px; margin:0 auto; padding:140px 32px 96px; }

.faq-head { margin-bottom:56px; }
.faq-kicker { font-size:11px; font-weight:400; text-transform:uppercase; letter-spacing:3px; color:var(--acento); margin-bottom:18px; }
.faq-head h1 { font-size:clamp(34px,5vw,54px); font-weight:700; line-height:1.08; color:var(--verde-oscuro); margin-bottom:22px; }
.faq-lead { font-size:18px; font-weight:300; line-height:1.6; color:var(--gris-4); max-width:600px; }

.faq-list { border-top:1px solid var(--gris-2); }
.faq-item { border-bottom:1px solid var(--gris-2); }
.faq-item summary { list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:26px 0; font-size:19px; font-weight:700; line-height:1.35; color:var(--texto); transition:color .3s ease; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:"+"; flex:none; width:32px; height:32px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(48,102,45,0.35); border-radius:var(--radio-hoja-sm); color:var(--verde); font-size:20px; font-weight:300; transition:transform .3s ease, background .3s ease, color .3s ease; }
.faq-item summary:hover { color:var(--verde); }
.faq-item[open] summary::after { content:"–"; background:var(--verde); color:var(--blanco); }
.faq-item summary:focus-visible { outline:2px solid var(--acento); outline-offset:4px; }
.faq-item p { padding:0 56px 30px 0; font-size:16px; font-weight:300; line-height:1.75; color:var(--gris-4); }

.faq-cta { margin-top:64px; padding:40px; background:var(--fondo-calido); border-radius:var(--radio-hoja); display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.faq-cta p { font-size:20px; font-weight:700; color:var(--verde-oscuro); }

@media (max-width:640px) {
  .faq { padding:112px 20px 72px; }
  .faq-item summary { font-size:17px; padding:22px 0; }
  .faq-item p { padding-right:0; }
  .faq-cta { padding:28px 24px; }
}
