FAQ: two-column list

What you receive in Webflow

• 16 native elements and 6 classes.
• Breakpoints: mobile landscape (767px).
• No Embed elements. Everything is native.

How to paste it

1. Click Copy for Webflow.
2. Open your page in the Webflow Designer.
3. Press ⌘V or Ctrl+V.

HTML

<section class="faq1">
  <div class="faq1-inner">
    <h2 class="faq1-title">Frequently asked questions</h2>
    <div class="faq1-grid">
      <div class="faq1-item"><h3 class="faq1-q">Is there a free plan?</h3><p class="faq1-a">Yes. The Starter plan is free forever and includes one project.</p></div>
      <div class="faq1-item"><h3 class="faq1-q">Can I cancel anytime?</h3><p class="faq1-a">Of course. Cancel from your account page in two clicks, no questions asked.</p></div>
      <div class="faq1-item"><h3 class="faq1-q">Do you offer discounts?</h3><p class="faq1-a">Annual plans save 30%. We also have discounts for nonprofits and students.</p></div>
      <div class="faq1-item"><h3 class="faq1-q">Is my data secure?</h3><p class="faq1-a">All data is encrypted in transit and at rest, and we're SOC 2 Type II certified.</p></div>
    </div>
  </div>
</section>
<style>
.faq1 { font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; padding:96px 24px; background:#fff; }
.faq1-inner { max-width:1000px; margin:0 auto; }
.faq1-title { font-size:40px; color:#0f172a; margin:0 0 48px; text-align:center; }
.faq1-grid { display:grid; grid-template-columns:1fr 1fr; gap:40px 48px; }
.faq1-q { font-size:18px; color:#0f172a; margin:0 0 8px; }
.faq1-a { font-size:15px; line-height:1.7; color:#64748b; margin:0; }
@media (max-width:767px) { .faq1-grid { grid-template-columns:1fr; } }
</style>