FAQ 01

<!-- Paste markup into an Embed, or recreate as native elements.
     Styles below map 1:1 to the class names above. -->
<section class="faq_component">
  <div class="faq_container">
    <div class="faq_header">
      <p class="faq_eyebrow">Answers & Support</p>
      <h2 class="faq_title">Everything you were wondering.</h2>
      <p class="faq_subtitle">Grounded answers on sourcing, sustainability, and how we keep things simple. Still stuck? Our team replies within a day.</p>
    </div>
    <ul class="faq_list">
      <li class="faq_item">
        <div class="faq_row">
          <h3 class="faq_question">Where do you source your ingredients?</h3>
          <div class="faq_toggle">+</div>
        </div>
        <p class="faq_answer">Every ingredient is traced back to a named farm or cooperative. We partner with regenerative growers, publish our full sourcing map twice a year, and never buy through anonymous brokers.</p>
      </li>
      <li class="faq_item">
        <div class="faq_row">
          <h3 class="faq_question">Is the packaging actually compostable?</h3>
          <div class="faq_toggle">+</div>
        </div>
        <p class="faq_answer">Yes — the outer wrap and inner liner are both home-compostable within 90 days, certified to TÜV OK Compost HOME. No hidden plastic films, no greenwashing.</p>
      </li>
      <li class="faq_item">
        <div class="faq_row">
          <h3 class="faq_question">How does the subscription work?</h3>
          <div class="faq_toggle">+</div>
        </div>
        <p class="faq_answer">Choose a cadence — every 2, 4, or 6 weeks — and adjust, pause, or cancel anytime from your account. No lock-in, no fees, and you can skip a delivery with a single tap.</p>
      </li>
      <li class="faq_item">
        <div class="faq_row">
          <h3 class="faq_question">What's your return and refund policy?</h3>
          <div class="faq_toggle">+</div>
        </div>
        <p class="faq_answer">If something isn't right, tell us within 30 days and we'll refund or replace it — no need to ship anything back. We'd rather you keep it or pass it to a neighbour than waste it.</p>
      </li>
    </ul>
  </div>
</section>

<style>
.faq_component {
  background-color:#07221d;
  padding:120px 24px;
  width:100%;
  box-sizing:border-box;
  font-family:Inter,system-ui,-apple-system,sans-serif;
}

.faq_container {
  max-width:760px;
  margin:0 auto;
}

.faq_header {
  margin-bottom:64px;
  max-width:560px;
}

.faq_eyebrow {
  color:#8fe388;
  font-size:13px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  margin:0 0 20px 0;
  font-weight:500;
}

.faq_title {
  color:#f4f7f0;
  font-family:Georgia,'Times New Roman',serif;
  font-size:52px;
  line-height:1.05;
  font-weight:400;
  margin:0;
  letter-spacing:-0.01em;
}

.faq_subtitle {
  color:#9db8ac;
  font-size:17px;
  line-height:1.6;
  margin:20px 0 0 0;
  font-weight:300;
}

.faq_list {
  list-style:none;
  padding:0;
  margin:0;
  border-top:1px solid #173a32;
}

.faq_item {
  border-bottom:1px solid #173a32;
  padding:28px 0;
}

.faq_row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  cursor:pointer;
}

.faq_question {
  color:#f4f7f0;
  font-family:Georgia,'Times New Roman',serif;
  font-size:21px;
  font-weight:400;
  margin:0;
  line-height:1.3;
}

.faq_toggle {
  flex-shrink:0;
  width:40px;
  height:40px;
  border-radius:9999px;
  border:1px solid #2c5248;
  color:#8fe388;
  font-size:22px;
  font-weight:300;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}

.faq_answer {
  color:#9db8ac;
  font-size:16px;
  line-height:1.7;
  margin:18px 0 0 0;
  max-width:600px;
  font-weight:300;
}
</style>