/* Superbackings FAQ v1.0. All page selectors are scoped to .sbfaq-page.
   Uses the existing /src/include/navbar.php unchanged. */
html { scroll-behavior:smooth; }
body { margin:0; background:#0b121c; font-family:Montserrat,Arial,sans-serif; }
.sbfaq-page, .sbfaq-page * { box-sizing:border-box; }
.sbfaq-page { min-height:100vh; color:#eaf0f7; background:radial-gradient(ellipse at 80% 0%,#18283b 0%,transparent 36%),linear-gradient(180deg,#0e1722,#0a111a 70%,#0c1721); line-height:1.6; }
.sbfaq-page [hidden] { display:none !important; }
.sbfaq-page a { color:inherit; text-decoration:none; }
.sbfaq-page a:focus-visible, .sbfaq-page summary:focus-visible, .sbfaq-page input:focus-visible, .sbfaq-page button:focus-visible { outline:2px solid #f8bd24; outline-offset:4px; }
.sbfaq-shell { max-width:1280px; padding:0 28px; margin:0 auto; }
.sbfaq-breadcrumb { display:flex; gap:11px; align-items:center; padding:25px 0 13px; color:#95a7bd; font-size:12px; font-weight:600; }
.sbfaq-breadcrumb a:hover { color:#f8bd24; }
.sbfaq-breadcrumb span:last-child { color:#d5deea; }
.sbfaq-hero { display:grid; grid-template-columns:minmax(0,1fr) 310px; min-height:328px; position:relative; overflow:hidden; margin:12px 0 25px; border:1px solid #41536a; border-radius:18px; background:linear-gradient(123deg,#233449 0%,#1b2b3b 52%,#15222f 100%); box-shadow:0 20px 45px #0004; }
.sbfaq-hero::after { content:''; position:absolute; right:175px; top:-110px; width:300px; height:300px; border-radius:50%; background:radial-gradient(circle,#f8bd2417,transparent 65%); pointer-events:none; }
.sbfaq-hero__copy { padding:49px 55px 50px; position:relative; z-index:1; }
.sbfaq-eyebrow { display:flex; align-items:center; gap:10px; letter-spacing:.17em; font-size:11px; color:#f8c75a; font-weight:800; }
.sbfaq-dot { width:8px; height:8px; display:inline-block; border-radius:50%; background:#f8bd24; box-shadow:0 0 0 5px #f8bd241c; }
.sbfaq-hero h1 { margin:15px 0 13px; font-size:clamp(37px,4.4vw,61px); font-weight:800; line-height:1.12; letter-spacing:-.044em; color:#fff; }
.sbfaq-hero h1 span { color:#f8bd24; }
.sbfaq-hero__lead { color:#c8d4e3; font-size:15px; line-height:1.8; max-width:665px; margin:0; }
.sbfaq-hero__quicklinks { display:flex; gap:12px; flex-wrap:wrap; margin-top:27px; }
.sbfaq-hero__quicklinks a { display:inline-flex; gap:14px; align-items:center; background:#f8bd24; color:#16202c; border:1px solid #f8bd24; padding:12px 18px; border-radius:9px; font-weight:800; font-size:12px; transition:transform .18s,background .18s; }
.sbfaq-hero__quicklinks a + a { background:#ffffff0e; color:#eef5ff; border-color:#738397; }
.sbfaq-hero__quicklinks a:hover { transform:translateY(-2px); background:#ffd35b; }
.sbfaq-hero__quicklinks a + a:hover { background:#3b4c62; }
.sbfaq-hero__art { border-left:1px solid #53647b36; position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; background:linear-gradient(155deg,#35455425,#0d1a289e); overflow:hidden; }
.sbfaq-hero__number { position:relative; z-index:1; font-weight:800; color:#f8bd24; letter-spacing:-.13em; line-height:.96; font-size:138px; padding-right:17px; text-shadow:0 12px 34px #0007; }
.sbfaq-hero__artlabel { font-size:12px; letter-spacing:.24em; line-height:1.5; color:#d8e4f4; text-align:center; font-weight:800; margin-top:15px; }
.sbfaq-hero__wave { display:flex; align-items:center; justify-content:center; height:80px; gap:6px; margin-top:13px; opacity:.9; }
.sbfaq-hero__wave i { width:4px; height:12px; background:linear-gradient(#fbd56b,#94723c); border-radius:5px; }
.sbfaq-hero__wave i:nth-child(2n) { height:29px; }
.sbfaq-hero__wave i:nth-child(3n) { height:51px; }
.sbfaq-hero__wave i:nth-child(5n) { height:68px; }
.sbfaq-search { display:flex; align-items:center; gap:24px; justify-content:space-between; padding:20px 26px; margin-bottom:24px; background:#172433; border:1px solid #37495d; border-radius:13px; }
.sbfaq-search__inputwrap { position:relative; flex:1; max-width:690px; }
.sbfaq-search__inputwrap svg { position:absolute; width:20px; height:20px; top:50%; transform:translateY(-50%); left:18px; color:#a5b3c6; pointer-events:none; }
.sbfaq-search input { display:block; width:100%; height:52px; padding:0 88px 0 51px; border:1px solid #687b91; background:#0b1622; color:#fff; border-radius:9px; outline:0; font:500 13px Montserrat,Arial,sans-serif; }
.sbfaq-search input::placeholder { color:#8799ad; }
.sbfaq-search input:focus { border-color:#f8bd24; box-shadow:0 0 0 3px #f8bd2417; }
.sbfaq-clear { position:absolute; right:10px; top:9px; padding:8px 12px; font:700 12px Montserrat,Arial,sans-serif; color:#f8bd24; background:#203044; border:0; border-radius:6px; cursor:pointer; }
.sbfaq-search__count { margin:0; white-space:nowrap; font-size:12px; color:#aebdd0; font-weight:650; }
.sbfaq-layout { display:grid; grid-template-columns:270px minmax(0,1fr); gap:31px; align-items:start; }
.sbfaq-sidebar__inner { position:sticky; top:25px; border:1px solid #2e4054; border-radius:12px; background:#131f2d; padding:22px 15px 16px; }
.sbfaq-sidebar__label { color:#8397ae; letter-spacing:.18em; font-weight:800; font-size:10px; padding:0 10px 14px; }
.sbfaq-sidebar nav { display:grid; gap:5px; }
.sbfaq-sidebar nav a { display:grid; grid-template-columns:28px 1fr 15px; align-items:center; gap:8px; padding:14px 10px; border:1px solid transparent; border-radius:8px; font-size:12px; line-height:1.48; font-weight:700; color:#bfccdb; }
.sbfaq-sidebar nav a:hover { color:#fff; border-color:#52647a; background:#253549; }
.sbfaq-sidebar__index { color:#f8bd24; font-size:11px; }
.sbfaq-sidebar__arrow { color:#849ab2; }
.sbfaq-sidebar__help { margin-top:17px; padding:22px 16px; border:1px solid #705a33; background:linear-gradient(135deg,#302b29,#202a33); border-radius:9px; }
.sbfaq-sidebar__help > span { color:#f8bd24; font-size:10px; letter-spacing:.12em; font-weight:800; }
.sbfaq-sidebar__help p { margin:11px 0 19px; color:#d4deeb; font-size:12px; line-height:1.7; }
.sbfaq-sidebar__help a { color:#f8bd24; font-size:12px; font-weight:800; }
.sbfaq-sidebar__help a:hover { text-decoration:underline; }
.sbfaq-section { margin:2px 0 47px; scroll-margin-top:30px; }
.sbfaq-section__head { display:flex; align-items:center; gap:17px; margin-bottom:20px; }
.sbfaq-section__number { background:#f8bd24; width:48px; height:48px; display:flex; align-items:center; justify-content:center; color:#1c2430; border-radius:10px; flex:none; font-size:14px; font-weight:800; }
.sbfaq-section h2 { font-size:clamp(20px,2vw,26px); font-weight:800; letter-spacing:-.028em; color:#fff; line-height:1.3; margin:0; }
.sbfaq-section__head p { color:#96aac0; margin:4px 0 0; font-size:12px; line-height:1.55; }
.sbfaq-items { display:grid; gap:10px; }
.sbfaq-item { border:1px solid #33465a; background:#172433; border-radius:10px; overflow:hidden; scroll-margin-top:22px; }
.sbfaq-item[open] { border-color:#88703c; background:#1a2939; box-shadow:0 6px 20px #0002; }
.sbfaq-item summary { padding:20px 20px 20px 23px; display:flex; align-items:center; gap:20px; justify-content:space-between; cursor:pointer; font-weight:700; color:#eaf1fa; font-size:14px; line-height:1.55; list-style:none; }
.sbfaq-item summary::-webkit-details-marker { display:none; }
.sbfaq-item summary:hover { color:#fcd675; }
.sbfaq-item[open] summary { color:#f8d072; }
.sbfaq-item__plus { flex:none; width:27px; height:27px; position:relative; border-radius:7px; background:#28394c; border:1px solid #52677d; }
.sbfaq-item__plus::before, .sbfaq-item__plus::after { content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); background:#e1ebf7; border-radius:3px; }
.sbfaq-item__plus::before { width:11px; height:2px; }
.sbfaq-item__plus::after { width:2px; height:11px; transition:height .12s; }
.sbfaq-item[open] .sbfaq-item__plus { background:#463c2c; border-color:#ae8e49; }
.sbfaq-item[open] .sbfaq-item__plus::after { height:0; }
.sbfaq-answer { border-top:1px solid #32465b; margin:0 23px 20px; padding-top:18px; }
.sbfaq-answer p { font-size:13px; color:#c4d1df; line-height:1.95; margin:0; max-width:76ch; }
.sbfaq-answer a { color:#ffd05e; text-decoration:underline; text-underline-offset:3px; }
.sbfaq-answer a:hover { color:#ffe49f; }
.sbfaq-answer strong { color:#f2f5fa; }
.sbfaq-no-results { padding:50px 22px; text-align:center; background:#172433; border:1px dashed #506278; border-radius:12px; }
.sbfaq-no-results strong { color:#fff; }
.sbfaq-no-results p { color:#b5c4d5; font-size:13px; }
.sbfaq-no-results a { color:#f8bd24; text-decoration:underline; }
.sbfaq-cta { display:flex; align-items:center; justify-content:space-between; gap:30px; margin:3px 0 31px; padding:37px 43px; border-radius:14px; border:1px solid #8a6c35; background:linear-gradient(108deg,#2d343d,#33352d 58%,#3d382b); }
.sbfaq-cta > div > span { color:#f8bd24; font-size:10px; letter-spacing:.15em; font-weight:800; }
.sbfaq-cta h2 { color:#fff; font-size:clamp(20px,2.1vw,29px); font-weight:800; line-height:1.35; margin:10px 0; max-width:600px; }
.sbfaq-cta p { margin:0; color:#c3d0dd; font-size:12px; line-height:1.85; }
.sbfaq-cta > a { flex:none; background:#f8bd24; color:#14202e; font-size:12px; font-weight:800; display:inline-flex; gap:16px; align-items:center; padding:17px 19px; border-radius:9px; }
.sbfaq-cta > a:hover { background:#ffda6f; }
.sbfaq-footer { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; padding:0 0 36px; color:#7f91a5; font-size:10px; font-weight:700; letter-spacing:.08em; }
.sbfaq-footer a:hover { color:#f8bd24; }
.sbfaq-sr-only { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:1000px) {
  .sbfaq-hero { grid-template-columns:minmax(0,1fr) 230px; }
  .sbfaq-hero__copy { padding:44px 34px; }
  .sbfaq-hero__number { font-size:107px; }
  .sbfaq-layout { grid-template-columns:220px minmax(0,1fr); gap:20px; }
  .sbfaq-sidebar nav a { font-size:11px; }
  .sbfaq-search { gap:14px; }
  .sbfaq-search__count { white-space:normal; text-align:right; }
}
@media(max-width:740px) {
  .sbfaq-shell { padding:0 15px; }
  .sbfaq-breadcrumb { padding:18px 2px 10px; }
  .sbfaq-hero { grid-template-columns:1fr; min-height:0; margin:9px 0 16px; }
  .sbfaq-hero__copy { padding:37px 24px 32px; }
  .sbfaq-hero h1 { font-size:39px; }
  .sbfaq-hero__lead { font-size:13px; }
  .sbfaq-hero__art { display:none; }
  .sbfaq-hero__quicklinks { gap:9px; }
  .sbfaq-hero__quicklinks a { padding:12px 13px; font-size:11px; }
  .sbfaq-search { flex-direction:column; align-items:stretch; gap:10px; padding:15px; }
  .sbfaq-search__inputwrap { max-width:none; }
  .sbfaq-search__count { text-align:left; padding:0 4px; }
  .sbfaq-layout { display:block; }
  .sbfaq-sidebar__inner { position:static; padding:16px 13px; margin-bottom:28px; }
  .sbfaq-sidebar nav { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sbfaq-sidebar nav a { grid-template-columns:19px 1fr; gap:7px; font-size:10px; padding:11px 8px; }
  .sbfaq-sidebar__arrow { display:none; }
  .sbfaq-sidebar__help { display:none; }
  .sbfaq-section { margin-bottom:35px; }
  .sbfaq-section__head { gap:12px; }
  .sbfaq-section__number { width:39px; height:39px; font-size:12px; }
  .sbfaq-section h2 { font-size:20px; }
  .sbfaq-item summary { padding:17px 14px; font-size:12px; gap:12px; }
  .sbfaq-answer { margin:0 14px 17px; padding-top:13px; }
  .sbfaq-answer p { font-size:12px; }
  .sbfaq-cta { padding:27px 22px; flex-direction:column; align-items:flex-start; gap:19px; }
  .sbfaq-cta > a { width:100%; justify-content:space-between; }
  .sbfaq-footer { font-size:9px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .sbfaq-page * { transition:none !important; } }