/* FAQ accordion */
.faq-layout{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:clamp(1.5rem,4vw,4.5rem);
  align-items:start;
}
.faq-aside{position:sticky;top:calc(var(--header-h) + 2rem)}
.faq-aside h2{margin-bottom:var(--space-md)}
.faq-aside p{color:var(--color-text-secondary);margin-bottom:var(--space-lg)}

.faq-list{display:grid;gap:.75rem}
.faq-item{
  border:1px solid var(--color-border);
  border-radius:var(--radius-md);
  background:rgba(11,19,32,.55);
  overflow:hidden;
  transition:border-color var(--t-fast),background var(--t-fast);
}
.faq-item.is-open{
  border-color:var(--color-border-strong);
  background:var(--color-surface);
}
.faq-heading{margin:0;font-size:inherit;font-weight:inherit;line-height:inherit}

.faq-q{
  width:100%;
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-md);
  padding:1.1rem clamp(1rem,2vw,1.5rem);
  text-align:left;
  font-size:1rem;
  font-weight:600;
  color:#fff;
  transition:color var(--t-fast);
}
.faq-q:hover{color:var(--color-primary)}

.faq-icon{
  position:relative;
  width:20px;height:20px;flex:none;
  border-radius:50%;
  border:1px solid var(--color-border-strong);
}
.faq-icon::before,
.faq-icon::after{
  content:"";
  position:absolute;
  top:50%;left:50%;
  translate:-50% -50%;
  background:var(--color-primary);
  transition:transform var(--t-fast),opacity var(--t-fast);
}
.faq-icon::before{width:9px;height:1.5px}
.faq-icon::after{width:1.5px;height:9px}
.faq-item.is-open .faq-icon::after{transform:scaleY(0);opacity:0}

.faq-a{
  height:0;
  overflow:hidden;
  transition:height var(--t-med);
}
.faq-a > div{
  padding:0 clamp(1rem,2vw,1.5rem) 1.25rem;
  color:var(--color-text-secondary);
  font-size:.95rem;
  line-height:1.68;
}
.faq-a p{margin:0}
.faq-a p + p{margin-top:.9em}