/* /questions: every question, as <details class="acc"> (site.css), grouped by topic, with a search box. */

/* ---------- hero ---------- */
.q-hero h1{font-size:78px}
.q-hero .lead a{font-weight:600}
.q-float{position:absolute;z-index:1;height:58px;display:flex;align-items:center;gap:14px;padding:0 14px 0 20px;border-radius:18px;background:#fff;box-shadow:0 24px 50px rgba(1,31,73,.14),0 4px 10px rgba(1,31,73,.06);font-size:15px;font-weight:700;white-space:nowrap}
.q-float .i{width:26px;height:26px;padding:6px;border-radius:13px;background:var(--ground)}
.q-f1{left:-56px;top:126px;transform:perspective(1200px) rotateY(calc(24deg + var(--ry,0deg))) rotateZ(-6deg)}
.q-f2{left:-6px;top:226px;transform:perspective(1200px) rotateY(calc(24deg + var(--ry,0deg))) rotateZ(-4deg)}
.q-f3{right:-56px;top:304px;transform:perspective(1200px) rotateY(calc(-22deg + var(--ry,0deg))) rotateZ(4deg)}
.q-tile{position:absolute;z-index:1;right:0;top:110px;width:136px;height:136px;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:34px;background:linear-gradient(140deg,#2F7BF0 0%,#0145C2 55%,#0A3A9E 100%);color:#fff;font-size:92px;font-weight:800;line-height:1;box-shadow:inset 0 2px 0 rgba(255,255,255,.35),0 34px 60px -16px rgba(1,69,194,.6);transform:perspective(1200px) rotateY(calc(-28deg + var(--ry,0deg))) rotateX(calc(14deg + var(--rx,0deg))) rotateZ(10deg)}
.q-tile::before{content:'';position:absolute;inset:0;background:linear-gradient(140deg,rgba(255,255,255,.35) 0%,rgba(255,255,255,0) 45%)}
.q-search{position:relative;max-width:760px;height:72px;margin:38px auto 0;display:flex;align-items:center;gap:12px;padding:0 7px 0 26px;border-radius:36px;background:#fff;box-shadow:inset 0 0 0 2px var(--deep),0 20px 44px -20px rgba(1,69,194,.4)}
.q-search[hidden]{display:none}
.q-search>.i{color:var(--deep)}
.q-search input{flex:1;min-width:0;height:100%;border:0;background:none;color:var(--navy);font:400 19px var(--font);outline:none}
.q-search input::placeholder{color:#7A8599}
.q-search input::-webkit-search-cancel-button{cursor:pointer}
.q-search:focus-within{box-shadow:inset 0 0 0 2px var(--deep),0 0 0 5px rgba(1,69,194,.16),0 20px 44px -20px rgba(1,69,194,.4)}
.q-search .btn{height:58px;padding:0 26px;border:0;font-family:var(--font);font-size:17px;cursor:pointer}
.q-found{margin-top:14px;font-size:15px;color:var(--slate)}
.q-found:empty{display:none}
.q-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:30px}
.q-chips a,.q-topics a{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--navy);font-weight:600}
.q-chips a{height:44px;padding:0 14px 0 16px;border-radius:22px;background:#fff;box-shadow:inset 0 0 0 1px #E1E7EF,0 8px 20px -12px rgba(1,31,73,.2);font-size:15.5px}
.q-chips a:hover,.q-topics a:hover{color:var(--deep)}
.q-chips .i,.q-topics .i{color:var(--deep)}
.q-chips i,.q-topics i{font:400 12px var(--mono);font-style:normal;color:var(--slate)}
@media (max-width:1339px){.q-f1{left:0}.q-f2{left:30px}.q-f3{right:0}}
@media (max-width:1099px){.q-float,.q-tile{display:none}.q-hero h1{font-size:60px}}
@media (max-width:759px){
  .q-hero h1{font-size:42px}
  .q-search{height:60px;margin-top:26px;padding:0 5px 0 16px;gap:8px}
  .q-search>.i{width:20px;height:20px}
  .q-search input{font-size:16px}
  .q-search .btn{height:50px;padding:0 16px;font-size:15px}
  .q-chips{justify-content:flex-start;gap:8px;margin-top:20px}
  .q-chips a{height:40px;padding:0 12px;font-size:14px}
}

/* ---------- body ---------- */
.q-body{display:grid;grid-template-columns:290px minmax(0,1fr);gap:48px;align-items:start;padding-top:96px}
.q-aside{position:sticky;top:24px;display:flex;flex-direction:column;gap:14px;padding:14px;border-radius:26px;background:#fff;box-shadow:0 30px 60px -36px rgba(1,31,73,.25)}
.q-topics{display:flex;flex-direction:column}
.q-topics p{padding:12px 14px 8px;font-size:12px;letter-spacing:.1em;color:var(--slate)}
.q-topics a{height:50px;padding:0 14px;border-radius:14px;font-size:16px}
.q-topics a:hover{background:var(--ground)}
.q-topics a:target,.q-topics a:focus-visible{background:var(--tint-blue)}
.q-topics i{margin-left:auto}
.q-stuck{padding:22px;border-radius:20px;background:var(--navy);color:#fff}
.q-stuck h2{font-size:20px;font-weight:800}
.q-stuck p{margin-top:10px;font-size:15px;line-height:1.5;color:var(--on-dark)}
.q-stuck .btn{width:100%;height:46px;margin-top:16px;color:var(--deep);font-size:15px}
.q-stuck :focus-visible{outline-color:var(--green)}
.q-groups{display:flex;flex-direction:column}
.q-group{display:flex;flex-direction:column;gap:14px;scroll-margin-top:24px}
.q-group+.q-group{margin-top:56px}
.q-group[hidden]{display:none}
.q-gh{display:flex;align-items:center;gap:16px;margin-bottom:6px}
.q-gi{width:50px;height:50px;flex:none;display:flex;align-items:center;justify-content:center;border-radius:15px;background:#fff;color:var(--deep);box-shadow:0 12px 26px -14px rgba(1,31,73,.3)}
.q-gh h2{font-size:32px;font-weight:800;letter-spacing:-.025em}
.q-gh .mono{margin-top:8px;font-size:13px;color:var(--slate)}
.q-group .acc[hidden]{display:none}
.q-none{padding:24px 26px;border-radius:20px;background:#fff;font-size:17px}
.q-none[hidden]{display:none}
@media (max-width:1099px){.q-body{grid-template-columns:minmax(0,1fr)}.q-aside{position:static;order:2}.q-topics{display:none}.q-stuck{display:flex;flex-wrap:wrap;align-items:center;gap:6px 24px}.q-stuck p{margin-top:0;flex:1}.q-stuck .btn{width:auto;margin-top:0}}
@media (max-width:759px){
  .q-body{gap:28px;padding-top:56px}
  .q-aside{padding:0;background:none;box-shadow:none}
  .q-stuck{display:block;padding:22px}
  .q-stuck p{margin-top:8px}
  .q-stuck .btn{width:100%;margin-top:14px}
  .q-group{gap:12px}
  .q-group+.q-group{margin-top:40px}
  .q-gh{gap:12px}
  .q-gi{width:42px;height:42px;border-radius:13px}
  .q-gh h2{font-size:24px}
  .q-gh .mono{display:none}
}