/* ============================================================
   FAQ PAGE — save as wwwroot/css/faq.css
   Needs site.css + brand.css.
   ============================================================ */

.page-head{background:linear-gradient(120deg,#F5F3FE,#EDF3FE);border-bottom:1px solid var(--line);padding-block:clamp(24px,3.5vw,40px)}
.page-head h1{font-size:clamp(1.6rem,3.4vw,2.2rem);font-weight:700;color:var(--navy)}
.crumbs{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:var(--muted);margin-bottom:.5rem;flex-wrap:wrap}
.crumbs a:hover{color:var(--violet)}
.crumbs b{color:var(--violet);font-weight:600}

.faq-section{background:var(--soft)}
.faq-wrap{max-width:860px}

.sec-head{text-align:center;max-width:640px;margin:0 auto clamp(1.8rem,3.5vw,2.6rem)}
.sec-tag{display:inline-block;background:var(--violet-soft,#F1EBFF);color:var(--violet);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:.35rem .9rem;border-radius:999px;margin-bottom:.9rem}
.sec-head h2{font-size:clamp(1.4rem,2.8vw,1.9rem);font-weight:700;color:var(--navy)}
.sec-head p{color:var(--muted);margin:.6rem 0 0}

/* ---------- Accordion ---------- */
.faq-list{display:grid;gap:12px}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:border-color .18s,box-shadow .18s}
.faq-item[open]{border-color:var(--violet);box-shadow:var(--shadow-sm)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:1.05rem 1.25rem;font-weight:600;font-size:.98rem;color:var(--navy);transition:color .15s}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--violet)}
.faq-item[open] summary{color:var(--violet)}
.faq-chev{width:19px;height:19px;flex:none;color:var(--muted-2);transition:transform .25s}
.faq-item[open] .faq-chev{transform:rotate(180deg);color:var(--violet)}

.faq-answer{padding:0 1.25rem 1.15rem;color:var(--muted);line-height:1.85;font-size:.92rem}
.faq-answer p{margin:0 0 .7rem}
.faq-answer p:last-child{margin-bottom:0}
.faq-answer ul,.faq-answer ol{padding-inline-start:1.3rem;margin:0 0 .7rem}
.faq-answer strong{color:var(--navy);font-weight:600}
.faq-answer span{background:transparent !important;color:inherit !important}

.faq-empty{text-align:center;color:var(--muted);padding-block:3rem;background:#fff;border:1px dashed var(--line);border-radius:var(--radius)}

/* ---------- Bottom CTA ---------- */
.faq-cta{margin-top:clamp(24px,4vw,36px);background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:clamp(20px,3.5vw,30px);display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.faq-cta h3{font-size:1.15rem;font-weight:700;color:var(--navy);margin-bottom:.25rem}
.faq-cta p{color:var(--muted);font-size:.9rem;margin:0}
.faq-cta-actions{display:flex;gap:10px;flex-wrap:wrap}
.btn-whatsapp-sm{display:inline-flex;align-items:center;gap:.5rem;background:#3DC553;color:#fff;font-weight:600;font-size:.95rem;padding:.8rem 1.3rem;border-radius:10px;transition:background .15s}
.btn-whatsapp-sm:hover{background:#33AC47}
.btn-whatsapp-sm svg{width:19px;height:19px}
