/* WebLock FAQ — front-end widget.
   Fonts are inherited from your theme so the widget matches your site automatically.
   To match your exact brand colour, change --wl-accent below to your hex value. */
#wl-faq{
  --wl-accent:#1671c0;            /* WebLock blue — set to your exact brand hex if needed */
  --wl-bg:#f7f8fa;--wl-surface:#ffffff;--wl-ink:#16202e;--wl-muted:#5e6b7d;--wl-line:#e4e8ee;
  --wl-accent-soft:#e9f1fb;--wl-mark:#fde68a;--wl-radius:14px;
  --wl-shadow:0 1px 2px rgba(16,32,46,.04),0 8px 24px -12px rgba(16,32,46,.18);
  box-sizing:border-box;max-width:780px;margin:0 auto;padding:4px;
  font-family:inherit;color:var(--wl-ink);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;text-align:left;
}
#wl-faq *{box-sizing:border-box;}
#wl-faq .wl-eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--wl-accent);margin:0 0 8px;}
#wl-faq .wl-title{font-family:inherit;font-weight:700;font-size:clamp(26px,5vw,38px);line-height:1.1;letter-spacing:-.01em;margin:0 0 10px;color:var(--wl-ink);}
#wl-faq .wl-lede{margin:0 0 26px;color:var(--wl-muted);max-width:60ch;}
#wl-faq .wl-search{position:relative;margin-bottom:18px;}
#wl-faq .wl-search svg{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--wl-muted);pointer-events:none;}
#wl-faq .wl-search input{width:100%;font-family:inherit;font-size:16px;color:var(--wl-ink);padding:16px 48px 16px 50px;border:1.5px solid var(--wl-line);border-radius:var(--wl-radius);background:var(--wl-surface);box-shadow:var(--wl-shadow);transition:border-color .18s,box-shadow .18s;appearance:none;outline:none;}
#wl-faq .wl-search input::placeholder{color:#9aa6b6;}
#wl-faq .wl-search input:focus{border-color:var(--wl-accent);box-shadow:0 0 0 4px var(--wl-accent-soft);}
#wl-faq .wl-clear{position:absolute;right:12px;top:50%;transform:translateY(-50%);border:none;background:#eef1f5;color:var(--wl-muted);cursor:pointer;width:28px;height:28px;border-radius:50%;display:none;align-items:center;justify-content:center;font-size:16px;line-height:1;}
#wl-faq .wl-clear.show{display:flex;}
#wl-faq .wl-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;}
#wl-faq .wl-chip{font-family:inherit;font-size:13.5px;font-weight:500;cursor:pointer;padding:7px 14px;border-radius:999px;border:1.5px solid var(--wl-line);background:var(--wl-surface);color:var(--wl-muted);transition:all .15s;white-space:nowrap;}
#wl-faq .wl-chip:hover{border-color:#c7cfdb;color:var(--wl-ink);}
#wl-faq .wl-chip[aria-pressed="true"]{background:var(--wl-accent);border-color:var(--wl-accent);color:#fff;}
#wl-faq .wl-count{font-size:13.5px;color:var(--wl-muted);margin:0 2px 14px;min-height:18px;}
#wl-faq .wl-count b{color:var(--wl-ink);font-weight:600;}
#wl-faq #wl-list{display:flex;flex-direction:column;}
#wl-faq .wl-group-title{width:100%;}
#wl-faq .wl-group{margin-bottom:26px;}
#wl-faq .wl-group.wl-hidden{display:none;}
#wl-faq .wl-group-title{font-family:inherit;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--wl-muted);margin:0 0 10px;padding-left:12px;border-left:3px solid var(--wl-accent);}
#wl-faq .wl-item{background:var(--wl-surface);border:1.5px solid var(--wl-line);border-radius:var(--wl-radius);margin-bottom:10px;overflow:hidden;transition:border-color .18s,box-shadow .18s;opacity:0;transform:translateY(6px);animation:wlIn .4s ease forwards;}
#wl-faq .wl-item.wl-hidden{display:none;}
#wl-faq .wl-item:hover{border-color:#c7cfdb;}
#wl-faq .wl-item.open{border-color:var(--wl-accent);box-shadow:var(--wl-shadow);}
#wl-faq .wl-q{width:100%;text-align:left;font-family:inherit;font-size:16.5px;font-weight:600;color:var(--wl-ink);background:none;border:none;cursor:pointer;padding:17px 20px;display:flex;align-items:flex-start;gap:14px;line-height:1.4;}
#wl-faq .wl-q-text{flex:1;}
#wl-faq .wl-q mark{background:var(--wl-mark);color:inherit;border-radius:3px;padding:0 1px;}
#wl-faq .wl-icon{flex-shrink:0;width:22px;height:22px;margin-top:1px;color:var(--wl-accent);transition:transform .25s ease;}
#wl-faq .wl-item.open .wl-icon{transform:rotate(45deg);}
#wl-faq .wl-a-wrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows .26s ease;}
#wl-faq .wl-item.open .wl-a-wrap{grid-template-rows:1fr;}
#wl-faq .wl-a{overflow:hidden;}
#wl-faq .wl-a-in{padding:2px 20px 16px 56px;color:var(--wl-muted);font-size:15.5px;line-height:1.65;}
#wl-faq .wl-a-in p{margin:0 0 11px;}
#wl-faq .wl-a-in >:last-child{margin-bottom:0;}
#wl-faq .wl-a-in figure{margin:0 0 12px;}
#wl-faq .wl-a-in figure a{display:block;border:1.5px solid var(--wl-line);border-radius:10px;overflow:hidden;background:var(--wl-bg);}
#wl-faq .wl-a-in figure a:hover{border-color:var(--wl-accent);box-shadow:var(--wl-shadow);}
#wl-faq .wl-a-in img{display:block;width:100%;height:auto;max-height:420px;object-fit:contain;}
#wl-faq .wl-a-in figcaption{margin-top:7px;font-size:13px;color:var(--wl-muted);font-style:italic;}
#wl-faq .wl-a-in h3,#wl-faq .wl-a-in h4{color:var(--wl-ink);margin:4px 0 8px;line-height:1.3;font-weight:700;}
#wl-faq .wl-a-in h3{font-size:17px;}
#wl-faq .wl-a-in h4{font-size:15.5px;}
#wl-faq .wl-a-in ul,#wl-faq .wl-a-in ol{margin:0 0 11px;padding-left:22px;}
#wl-faq .wl-a-in li{margin:3px 0;}
#wl-faq .wl-a-in a{color:var(--wl-accent);text-decoration:underline;}
#wl-faq .wl-a-in a:hover{text-decoration:none;}
#wl-faq .wl-a-in strong,#wl-faq .wl-a-in b{font-weight:700;color:inherit;}
#wl-faq .wl-empty{display:none;text-align:center;padding:48px 20px;color:var(--wl-muted);border:1.5px dashed var(--wl-line);border-radius:var(--wl-radius);}
#wl-faq .wl-empty.show{display:block;}
#wl-faq .wl-empty strong{display:block;color:var(--wl-ink);font-size:17px;margin-bottom:4px;font-weight:600;}
@keyframes wlIn{to{opacity:1;transform:none;}}
@media(max-width:520px){#wl-faq .wl-a-in{padding-left:20px;}#wl-faq .wl-q{padding:15px 16px;font-size:15.5px;}}
@media(prefers-reduced-motion:reduce){#wl-faq *,#wl-faq .wl-item{animation:none!important;transition:none!important;}}