/* Payora Front — /help: search, category chips, topic cards, popular questions, contact. */

/* ---------------------------------------------------------------- hero + search */
.fxk-hero .fx-hero-lead a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-color:color-mix(in srgb,var(--accent) 35%,transparent)}
.fxk-hero .fx-actions{width:100%;max-width:720px}
.fxk-searchwrap{width:100%;display:flex;flex-direction:column;gap:12px}
.fxk-search{position:relative;display:flex;align-items:center;gap:14px;height:66px;padding:0 16px 0 22px;border-radius:22px;background:var(--surface);border:1px solid var(--line-2);box-shadow:var(--shadow-2);color:var(--faint);transition:border-color .25s,box-shadow .35s var(--ease)}
.fxk-search::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:var(--jewel);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .35s}
.fxk-search:focus-within{border-color:transparent;box-shadow:var(--shadow-3),0 0 0 6px var(--amethyst-s)}
.fxk-search:focus-within::before{opacity:1}
.fxk-search:focus-within .fx-i{color:var(--amethyst)}
.fxk-search input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;color:var(--ink);font:500 18px var(--f-ui)}
.fxk-search input::placeholder{color:var(--faint)}
.fxk-search input::-webkit-search-cancel-button{cursor:pointer}
.fxk-search kbd{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:8px;border:1px solid var(--line-2);background:var(--surface-2);font-size:13px;color:var(--muted)}
.fxk-suggs{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px;font-size:13px;color:var(--faint)}
.fxk-sugg{height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink-2);font:500 13px var(--f-ui);cursor:pointer;transition:border-color .2s,background .2s,transform .3s var(--spring)}
.fxk-sugg:hover{border-color:var(--amethyst);background:var(--amethyst-s);transform:translateY(-1px)}

/* ---------------------------------------------------------------- topics */
.fxk-topics{padding-top:clamp(12px,2vw,24px)}
.fxk-bar{position:static;display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:28px;padding:8px 10px 8px 8px;border-radius:999px;background:color-mix(in srgb,var(--bg) 82%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--line)}
.fxk-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.fxk-chips::-webkit-scrollbar{display:none}
.fxk-chips .fx-fchip{white-space:nowrap;flex:none}
.fxk-count{flex:none;padding:0 8px;font-size:13px;color:var(--faint)}
.fxk-count [data-k-shown]{color:var(--ink);font-weight:600}
.fxk-groups{display:flex;flex-direction:column;gap:clamp(34px,5vw,56px)}
.fxk-group-h{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.fxk-group-h h2{font-size:clamp(22px,2.4vw,28px);letter-spacing:-.03em}
.fxk-group-ic{width:32px;height:32px;border-radius:10px;display:grid;place-items:center}
.fxk-group-tag{margin-left:auto;font-size:12px;color:var(--faint)}
.fxk-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.fxk-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
a.fxk-card{display:flex;flex-direction:column;gap:10px;padding:22px}
.fxk-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-2);border-color:var(--line-2)}
.fxk-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:4px}
.fxk-card .fx-tile{width:42px;height:42px;border-radius:13px}
.fxk-kind{font-size:11px;letter-spacing:.03em;padding:4px 8px;border-radius:8px;background:var(--surface-2);border:1px solid var(--line);color:var(--muted)}
.fxk-card h3{font-size:17px;line-height:1.3;letter-spacing:-.02em}
.fxk-card p{font-size:14.5px;color:var(--muted);line-height:1.6;flex:1}
.fxk-card .fx-card-link{margin-top:4px}
.fx mark.fxk-hl{background:linear-gradient(transparent 58%,color-mix(in srgb,var(--amber) 38%,transparent) 58%);color:inherit;padding:0 1px;border-radius:2px}
.fxk-group[hidden],[data-item][hidden]{display:none!important}
.fxk-empty{display:flex;gap:16px;align-items:flex-start;padding:22px;border-radius:var(--r-lg);background:var(--surface);border:1px dashed var(--line-3);animation:fx-open .45s var(--ease-out)}
.fxk-empty .fx-tile{flex:none}
.fxk-empty b{display:block;font:560 17px/1.3 var(--f-display)}
.fxk-empty p{margin-top:4px;color:var(--muted);font-size:14.5px}
.fxk-empty a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}

/* ---------------------------------------------------------------- questions */
.fxk-qas{max-width:880px;margin:0 auto;display:flex;flex-direction:column;gap:10px}
.fxk-qa summary{justify-content:flex-start}
.fxk-qa summary h3{flex:1}
.fxk-qa-dot{flex:none;width:10px;height:10px;border-radius:50%;background:currentColor}
.fxk-qa-dot.fx-tone-emerald{color:var(--emerald)}.fxk-qa-dot.fx-tone-sapphire{color:var(--sapphire)}.fxk-qa-dot.fx-tone-amethyst{color:var(--amethyst)}.fxk-qa-dot.fx-tone-ruby{color:var(--ruby)}
.fxk-qa .fx-qa-a{padding-left:50px}
.fxk-src{display:inline-flex;align-items:center;gap:8px;margin-top:12px;height:32px;padding:0 12px 0 4px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);font-size:13.5px;font-weight:600;color:var(--ink-2);transition:border-color .2s}
.fxk-src:hover{border-color:var(--line-3)}
.fxk-src .mono{font-size:11px;font-weight:500;padding:4px 8px;border-radius:999px;background:var(--surface);border:1px solid var(--line);color:var(--faint)}
.fxk-src .fx-i{transition:transform .3s var(--spring)}
.fxk-src:hover .fx-i{transform:translateX(3px)}

/* ---------------------------------------------------------------- contact */
.fxk-contact-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:16px;align-items:stretch}
.fxk-contact{position:relative;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:clamp(26px,4vw,44px);border-radius:var(--r-xl);background:var(--band);color:var(--band-ink);--ink:var(--band-ink);--muted:var(--band-muted);--line:var(--band-line);--surface:rgba(255,255,255,.05);--surface-2:rgba(255,255,255,.04)}
.fxk-contact .fx-eyebrow{background:rgba(255,255,255,.06);border-color:var(--band-line);color:var(--band-ink)}
.fxk-contact-glow{position:absolute;inset:0;z-index:-1;background:radial-gradient(520px 300px at 100% 0%,rgba(139,92,246,.34),transparent 70%),radial-gradient(420px 260px at 0% 100%,rgba(74,99,255,.28),transparent 70%)}
.fxk-contact .fx-acc{background:linear-gradient(100deg,#8EA2FF,#B697FF 40%,#FF86AC 76%,#FFC06A);-webkit-background-clip:text;background-clip:text;color:transparent}
.fxk-mail{display:flex;align-items:center;gap:14px;width:100%;margin-top:6px;padding:12px 12px 12px 14px;border-radius:20px;background:rgba(255,255,255,.06);border:1px solid var(--band-line)}
.fxk-mail-ic{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:var(--jewel);color:#fff;flex:none}
.fxk-mail-t{min-width:min(210px,100%);flex:1}
.fxk-mail-t small{display:block;font-size:12px;color:var(--band-muted)}
.fxk-mail-t b{font-size:clamp(15px,1.6vw,18px);overflow-wrap:anywhere}
.fx .fxk-mail-t a{color:#fff;text-decoration:none}
.fxk-copy{flex:none;display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#fff;font:600 13.5px var(--f-ui);cursor:pointer;transition:background .2s}
.fxk-copy:hover{background:rgba(255,255,255,.12)}
.fxk-copy.is-done{background:rgba(69,219,169,.18);border-color:rgba(69,219,169,.4)}
.fxk-contact-n{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;color:var(--band-muted)}
.fxk-contact-n .fx-i{flex:none;margin-top:3px}
.fxk-side{display:grid;grid-template-rows:repeat(4,minmax(0,1fr));gap:12px}
a.fxk-mini{display:flex;align-items:center;gap:14px;padding:18px 20px}
.fxk-mini:hover{transform:translateX(4px);border-color:var(--line-2)}
.fxk-mini .fx-tile{flex:none;width:42px;height:42px;border-radius:13px}
.fxk-mini b{display:block;font-size:15.5px}
.fxk-mini small{display:block;font-size:13px;color:var(--muted);line-height:1.45}
.fxk-mini-arr{margin-left:auto;flex:none;color:var(--faint);transition:transform .3s var(--spring),color .2s}
.fxk-mini:hover .fxk-mini-arr{transform:translateX(3px);color:var(--ink)}

/* ---------------------------------------------------------------- responsive */
@media (max-width:1180px){
  .fxk-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:980px){
  .fxk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fxk-contact-grid{grid-template-columns:minmax(0,1fr)}
  .fxk-side{grid-template-rows:none;grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  .fxk-search{height:56px;padding:0 12px 0 16px;border-radius:18px}
  .fxk-search input{font-size:16px}
  .fxk-search kbd{display:none}
  .fxk-bar{border-radius:18px;flex-direction:column;align-items:stretch;gap:6px;padding:8px}
  .fxk-count{align-self:flex-end}
  .fxk-grid,.fxk-grid-4,.fxk-side{grid-template-columns:minmax(0,1fr)}
  .fxk-group-tag{display:none}
  .fxk-qa .fx-qa-a{padding-left:22px}
  .fxk-mail{flex-wrap:wrap}
}