/* =====================================================================================
   Brand Elite - FAQ page (faq.php, /faq). LOCKED 16 Oct 2026 (Lohith picked option 1 "Topic Tabs").
   Loads after css/about.css (inner-page base). Tokens from css/system.css. Prefix: faqp-
   Hero (shared inner-page hero, orbit with 5 topic boxes) > topic tabs + accordion cards (Home FAQ look) in 2 columns
   > "Still Have a Question?" band. Words: includes/faqp-parts.php; behaviour: js/faqp.js.
   ===================================================================================== */
.faqp-page [id]{scroll-margin-top:110px}
.faqp-page .sv-ic{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- accordion card (Home FAQ look: white card, orange chip, question, plus toggle) ---------- */
.faqp-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 28px;align-items:start}
@media (max-width:899.98px){.faqp-list{grid-template-columns:minmax(0,1fr);gap:14px}}
.faqp-item{background:#fff;border-radius:22px;border:1px solid rgba(16,25,40,.06);box-shadow:0 22px 40px -22px rgba(30,64,130,.32),0 4px 10px rgba(30,64,130,.05);transition:box-shadow .3s var(--ease),border-color .3s}
.faqp-item.open{border-color:rgba(244,106,16,.28);box-shadow:0 26px 44px -18px rgba(30,64,130,.32),0 0 0 4px rgba(244,106,16,.06)}
.faqp-item[hidden]{display:none}
.faqp-q{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:16px;width:100%;min-height:44px;padding:20px 22px;cursor:pointer;border-radius:22px;text-align:left}
.faqp-q:focus-visible{outline:none;box-shadow:0 0 0 3px #fff,0 0 0 5px var(--navy)}
.faqp-chip{width:40px;height:40px;border-radius:12px;background:linear-gradient(160deg,#fff2e6,#ffe1c7);display:flex;align-items:center;justify-content:center;flex:none;color:#f46a10}
.faqp-chip .sv-ic{width:19px;height:19px}
.ab .faqp-qt{flex:1;margin:0;font-size:var(--fs-h3);font-weight:600;line-height:1.35;color:var(--navy)}
@media (min-width:900px){.ab .faqp-list:not(.one) .faqp-qt{font-size:var(--fs-body);font-weight:600}}
.faqp-tg{width:30px;height:30px;border-radius:50%;background:#fff2e6;display:flex;align-items:center;justify-content:center;flex:none;transition:background .25s}
.faqp-tg svg{width:12px;height:12px;fill:none;stroke:#f46a10;stroke-width:2.4;stroke-linecap:round;transition:transform .3s var(--ease)}
.faqp-item.open .faqp-tg{background:#f46a10}.faqp-item.open .faqp-tg svg{stroke:#fff;transform:rotate(45deg)}
@media (hover:hover){.faqp-q:hover .faqp-qt{color:#c2410c}}
.faqp-a{overflow:hidden;transition:height .35s var(--ease)}
.faqp-a-in{padding:0 22px 22px 78px}
.faqp-a-in p{margin:0;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-body)}
@media (max-width:600px){.faqp-q{padding:16px;gap:12px}.faqp-a-in{padding:0 16px 18px}}
.faqp-more{display:inline-flex;align-items:center;gap:6px;margin-left:4px;font-weight:600;color:#c2410c;text-decoration:none;white-space:nowrap}
.faqp-more svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s}
.faqp-more:hover{text-decoration:underline}.faqp-more:hover svg{transform:translateX(3px)}
.faqp-more:focus-visible{outline:2px solid var(--navy);outline-offset:3px;border-radius:4px}
/* ---------- option 1: topic tabs ---------- */
.faqp-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:clamp(28px,3vw,40px) 0 clamp(20px,2vw,28px)}   /* Lohith 16 Oct 2026: room above the tabs (heading block -> content gap) */
.faqp-tab{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border-radius:999px;background:#fff;border:1.5px solid rgba(16,25,40,.10);font-size:var(--fs-body);font-weight:500;color:var(--navy);cursor:pointer;transition:border-color .25s,background .25s,color .25s,box-shadow .25s}
.faqp-tab .sv-ic{width:18px;height:18px;color:#f46a10}
.faqp-tab b{font-weight:600;font-size:var(--fs-label);padding:1px 8px;border-radius:999px;background:#fff2e6;color:#c2410c}
.faqp-tab[aria-selected="true"]{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 12px 24px -12px rgba(244,106,16,.8)}
.faqp-tab[aria-selected="true"] .sv-ic{color:#fff}.faqp-tab[aria-selected="true"] b{background:rgba(255,255,255,.22);color:#fff}
@media (hover:hover){.faqp-tab:not([aria-selected="true"]):hover{border-color:#f78913;color:#c2410c}}
.faqp-tab:focus-visible{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--navy)}
@media (max-width:899.98px){.faqp-tabs{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;margin:28px calc(-1 * var(--pad)) 16px;padding:4px var(--pad) 10px;scrollbar-width:none}.faqp-tabs::-webkit-scrollbar{display:none}.faqp-tab{flex:none}}
.faqp-panel-h{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 clamp(28px,3vw,40px);font-size:var(--fs-body);color:var(--text-body);text-align:center}   /* the topic line: clear space below it before the questions */

/* ---------- shared: "Still Have a Question?" band ---------- */
.faqp-help-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;max-width:980px;margin:0 auto}
.ab .ab-hd + .faqp-help-row{margin-top:clamp(32px,3vw,40px)}   /* Lohith 16 Oct 2026: space below the "We reply within 1 working day" line (margin:0 auto above had removed it) */
@media (max-width:767.98px){.faqp-help-row{grid-template-columns:minmax(0,1fr);max-width:420px}}
.faqp-hcard{display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 18px;border-radius:22px;text-align:center;text-decoration:none;color:#fff;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);transition:transform .3s var(--ease),border-color .3s}
.faqp-hcard .ic{width:50px;height:50px;border-radius:50%;background:var(--grad);display:flex;align-items:center;justify-content:center;margin-bottom:6px;color:#fff}
.faqp-hcard b{font-size:var(--fs-h3);font-weight:600}
.faqp-hcard>span:last-child{font-size:var(--fs-body);color:var(--text-on-dark-muted)}
@media (hover:hover){.faqp-hcard:hover{transform:translateY(-4px);border-color:rgba(247,137,19,.6)}}
.faqp-hcard:focus-visible{outline:2px solid #fff;outline-offset:3px}
.faqp-help-cta{display:flex;justify-content:center;margin-top:40px}

@media (prefers-reduced-motion:reduce){.faqp-a,.faqp-tg svg,.faqp-item,.faqp-hcard,.faqp-more svg{transition:none}}
.faqp-list.split{display:flex;gap:28px;align-items:flex-start}
.faqp-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:20px}
/* option 1 spacing (Lohith 16 Oct 2026): 40px heading block -> tabs, 24px tabs -> topic line, 40px topic line -> questions.
   Scoped to .ab so the inner-page rules (.ab p{margin:0}, .ab-hd + *) cannot remove them. */
.ab .ab-hd + .faqp-tabs{margin-top:clamp(32px,3vw,40px)}
.ab .faqp-tabs{margin-bottom:clamp(20px,2vw,24px)}
.ab p.faqp-panel-h{margin:0 0 clamp(28px,3vw,40px)}
