/* ================= Section 8b · FAQ (Figma 1905:13706 "Block 7 — FAQ (Rescue)") ================= */
.pageFaq{position:relative;z-index:2;background:transparent;overflow:clip}
.frameFaq{position:relative;width:1440px;margin:0 auto;transform-origin:0 0;padding:0 40px 144px;display:flex;gap:80px;align-items:stretch}
.fq-left{flex:none;width:498px}
.fq-card{position:sticky;top:40px;width:498px;height:498px;border-radius:8px;overflow:hidden;color:#fff;isolation:isolate}
.fq-img{position:absolute;inset:0;display:grid;place-items:center;font:500 13px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.3)}
.fq-img img{width:100%;height:100%;object-fit:cover;display:block}
.fq-over{position:absolute;left:0;right:0;bottom:0;height:261px;padding:24px;display:flex;align-items:flex-end;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.95) 100%);-webkit-backdrop-filter:blur(2.5px);backdrop-filter:blur(2.5px);
  -webkit-mask:linear-gradient(180deg,transparent 0,#000 38%);mask:linear-gradient(180deg,transparent 0,#000 38%)}
.fq-over h3{margin:0;width:100%;font:500 24px/1.5 var(--rubik)}

.fq-right{flex:1;min-width:0;display:flex;flex-direction:column;gap:16px}
.fq-right h2{margin:0;font:800 72px/1.2 var(--rubik);letter-spacing:1.08px;text-transform:uppercase}
.fq-right h2 b{font-weight:800;color:var(--yellow)}
.fq-acc{display:flex;flex-direction:column;width:782px}
.fq-item{border-bottom:1px solid #2f2f2f;transition:border-color .4s var(--ease)}
.fq-item.on{border-color:var(--yellow)}
.fq-q{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:16px;width:100%;padding:32px 0;cursor:pointer;color:#fff}
.fq-q span{flex:1;min-width:0;font:400 20px/1.5 var(--rubik);transition:color .3s}
.fq-q:focus-visible{outline:2px solid var(--yellow);outline-offset:4px;border-radius:4px}
.fq-ic{flex:none;width:40px;height:40px;display:grid;place-items:center;color:#fff;transition:color .3s,transform .45s cubic-bezier(.34,1.3,.64,1)}
.fq-item.on .fq-ic{color:var(--yellow);transform:rotate(45deg)}
.fq-item:not(.on) .fq-q:hover .fq-ic{transform:rotate(90deg)}
.fq-item:not(.on) .fq-q:hover span{color:#dcdcdc}
.fq-a{height:0;overflow:hidden;transition:height .5s var(--ease)}
.fq-item.on .fq-a{height:auto}
.fq-a-in{padding:0 48px 32px}
.fq-a-in p{margin:0;font:400 16px/1.5 var(--rubik);opacity:0;transform:translateY(-6px);transition:opacity .35s var(--ease),transform .45s var(--ease)}
.fq-item.on .fq-a-in p{opacity:1;transform:none;transition-delay:.12s}

/* soft reveal */
.pageFaq.pre .rvf{opacity:0;transform:translateY(18px)}
.pageFaq.pre .fq-card{transform:translateY(22px) scale(.985)}
.pageFaq.go .rvf{transition:opacity .75s var(--ease) var(--d,0s),transform .85s var(--ease) var(--d,0s),border-color .4s var(--ease)}
.pageFaq.go .fq-card{transition:opacity .75s var(--ease),transform .9s cubic-bezier(.16,1,.3,1)}

@media (max-width:1199px){
  .frameFaq{width:auto;flex-direction:column;gap:32px;padding:24px 16px 72px;transform:none!important}
  .fq-left,.fq-card{width:100%}
  .fq-card{position:relative;top:auto;height:auto;aspect-ratio:1}
  .fq-over{height:60%;padding:18px}.fq-over h3{font-size:18px}
  .fq-acc{width:100%}
  .fq-right h2{font-size:40px}
  .fq-q{padding:22px 0}.fq-q span{font-size:16px}
  .fq-ic,.fq-ic svg{width:28px;height:28px}
  .fq-a-in{padding:0 0 24px}
}
@media (prefers-reduced-motion:reduce){
  .pageFaq.pre .rvf,.pageFaq.pre .fq-card{opacity:1;transform:none}
  .fq-a,.fq-a-in p,.fq-ic{transition:none}
}
