.faq-sheet{
  width:min(640px,calc(100vw - 32px));
  max-height:min(760px,calc(100dvh - 32px));
}
.faq-modal{position:relative;padding:22px}
.faq-modal-head{padding-right:42px;margin-bottom:16px}
.faq-modal-head>span,.faq-eyebrow{
  display:block;
  margin-bottom:6px;
  color:var(--color-primary,#4E9B65);
  font:800 9px/1.2 var(--mono,ui-monospace,monospace);
  letter-spacing:2px;
}
.faq-modal-head h2{
  margin:0;
  color:var(--color-ink,#101D28);
  font:800 clamp(22px,4vw,30px)/1 var(--disp,Inter,sans-serif);
  letter-spacing:-.02em;
}
.faq-modal-head p{
  max-width:540px;
  margin:8px 0 0;
  color:var(--color-slate,#68757C);
  font-size:12px;
  line-height:1.5;
}
.faq-list{
  overflow:hidden;
  border:1px solid var(--border-subtle,rgba(104,117,124,.24));
  border-radius:12px;
  background:var(--surface-elevated,#fff);
}
.faq-item{border-bottom:1px solid var(--border-subtle,rgba(104,117,124,.24))}
.faq-item:last-child{border-bottom:0}
.faq-item summary{
  display:grid;
  grid-template-columns:minmax(0,1fr) 22px;
  align-items:center;
  gap:12px;
  min-height:50px;
  padding:7px 14px;
  color:var(--color-ink,#101D28);
  font:700 12px/1.35 var(--mono,ui-monospace,monospace);
  cursor:pointer;
  list-style:none;
  transition:background .16s ease,color .16s ease;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{background:var(--surface-muted,#F3F5F4)}
.faq-item summary i{
  position:relative;
  width:20px;
  height:20px;
  border:1px solid var(--border-subtle,rgba(104,117,124,.34));
  border-radius:50%;
}
.faq-item summary i::before,.faq-item summary i::after{
  content:"";
  position:absolute;
  top:9px;
  left:5px;
  width:8px;
  height:1.5px;
  border-radius:2px;
  background:currentColor;
  transition:transform .18s ease;
}
.faq-item summary i::after{transform:rotate(90deg)}
.faq-item[open] summary{color:var(--color-primary,#4E9B65);background:color-mix(in srgb,var(--color-primary,#4E9B65) 8%,transparent)}
.faq-item[open] summary i::after{transform:rotate(0)}
.faq-answer{padding:0 14px 14px}
.faq-answer p{
  margin:0;
  max-width:58ch;
  color:var(--color-slate,#68757C);
  font-size:12px;
  line-height:1.65;
  animation:faq-reveal .2s ease both;
}
.faq-modal-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:14px;
}
.faq-modal-actions .btn{width:100%;margin:0;min-height:42px}
@keyframes faq-reveal{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

body.faq-page{
  --color-primary:#4E9B65;
  --color-ink:#101D28;
  --color-slate:#68757C;
  --surface-elevated:#FFFFFF;
  --surface-muted:#F3F5F4;
  --border-subtle:#BCC2C2;
  min-height:100vh;
  margin:0;
  color:var(--color-ink);
  background:
    radial-gradient(circle at 85% 7%,rgba(78,155,101,.12),transparent 25rem),
    #F3F5F4;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
html[data-theme="dark"] body.faq-page{
  --color-primary:#4E9B65;
  --color-ink:#F3F5F4;
  --color-slate:#AAB2B3;
  --surface-elevated:#17242D;
  --surface-muted:#1F2B34;
  --border-subtle:#3A4750;
  background:
    radial-gradient(circle at 85% 7%,rgba(78,155,101,.1),transparent 25rem),
    #101D28;
}
.faq-page-shell{width:min(880px,calc(100% - 32px));margin:0 auto;padding:28px 0 34px}
.faq-page-head{position:relative;padding:18px 0 26px;border-bottom:1px solid var(--border-subtle)}
.faq-brand{
  display:inline-flex;
  align-items:center;
  gap:3px;
  margin-bottom:48px;
  color:var(--color-ink);
  font-size:20px;
  font-weight:850;
  letter-spacing:-.06em;
  text-decoration:none;
}
.faq-brand b{color:var(--color-primary)}
.faq-page-head h1{
  max-width:720px;
  margin:0;
  font-size:clamp(36px,7vw,68px);
  line-height:.96;
  letter-spacing:-.055em;
}
.faq-page-head>p{max-width:580px;margin:16px 0 0;color:var(--color-slate);font-size:15px;line-height:1.6}
.faq-lang{position:absolute;top:18px;right:0;display:flex;gap:4px}
.faq-lang button{
  min-width:38px;
  min-height:36px;
  padding:0 8px;
  border:1px solid var(--border-subtle);
  border-radius:8px;
  color:var(--color-slate);
  background:var(--surface-elevated);
  font:800 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  cursor:pointer;
}
.faq-lang button[aria-pressed="true"]{border-color:var(--color-primary);color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 9%,var(--surface-elevated))}
.faq-page-main{padding:24px 0}
.faq-page-main .faq-list{box-shadow:0 18px 50px rgba(16,29,40,.06)}
.faq-page-main .faq-item summary{min-height:62px;padding:8px 20px;font-size:14px}
.faq-page-main .faq-answer{padding:0 20px 20px}
.faq-page-main .faq-answer p{font-size:14px}
.faq-page-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding-top:18px;
  border-top:1px solid var(--border-subtle);
  font:750 11px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;
}
.faq-page-foot a{color:var(--color-slate);text-decoration:none}
.faq-page-foot a:hover{color:var(--color-primary)}
.faq-page-foot nav{display:flex;gap:16px}
.faq-back{letter-spacing:.08em}
.faq-noscript{max-width:720px;margin:80px auto;padding:20px;line-height:1.6}

@media(max-width:640px){
  .faq-sheet{width:calc(100vw - 16px);max-width:none;max-height:calc(100dvh - 16px)}
  .faq-modal{padding:18px 14px 14px}
  .faq-modal-head{margin-bottom:12px}
  .faq-modal-head p{font-size:11px}
  .faq-item summary{min-height:48px;padding-inline:12px;font-size:11px}
  .faq-answer{padding:0 12px 12px}
  .faq-answer p{font-size:11px}
  .faq-modal-actions{grid-template-columns:1fr}
  .faq-page-shell{width:min(100% - 24px,880px);padding-top:12px}
  .faq-page-head{padding-top:64px}
  .faq-brand{position:absolute;top:14px;left:0;margin:0}
  .faq-lang{top:8px;max-width:220px;overflow-x:auto}
  .faq-lang button{min-width:36px;min-height:40px}
  .faq-page-main{padding:14px 0}
  .faq-page-main .faq-item summary{min-height:56px;padding-inline:14px;font-size:12px}
  .faq-page-main .faq-answer{padding:0 14px 16px}
  .faq-page-main .faq-answer p{font-size:12px}
  .faq-page-foot{align-items:flex-start;flex-direction:column}
}
@media(prefers-reduced-motion:reduce){
  .faq-item summary,.faq-item summary i::after,.faq-answer p{transition:none;animation:none}
}
body.reduced-motion .faq-item summary,
body.reduced-motion .faq-item summary i::after,
body.reduced-motion .faq-answer p{transition:none;animation:none}
