---
title: "Buy Credit"
date: 2024-10-11T14:20:00+00:00
draft: false
---

<div class="container">
  <div class="row">
    <div class="col-12">
      <div class="card mb-4">
        <div class="card-body">
          <h2 class="card-title">Top-up your credit easily</h2>
          <p>Maoré Mobile adapts to your needs and allows you to top up your credit from 1€!</p>
		  
          <div class="row mt-4">
            <div class="col-md-4">
              <div class="card h-100">
                <div class="card-body text-center">
                  <h4>From 1€</h4>
                  <p>Top-ups from 1€</p>
                </div>
              </div>
            </div>
            <div class="col-md-4">
              <div class="card h-100">
                <div class="card-body text-center">
                  <h4>Unlimited</h4>
                  <p>Credit with unlimited validity</p>
                </div>
              </div>
            </div>
            <div class="col-md-4">
              <div class="card h-100">
                <div class="card-body text-center">
                  <h4>No Commitment</h4>
                  <p>No time commitment</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <div class="card mb-4">
        <div class="card-body">
          <h2 class="card-title">How to top-up your credit?</h2>
          <div class="row">
            <div class="col-md-4 text-center mb-3">
              <div class="step-number">1</div>
              <h5>Buy Credit</h5>
              <p>Choose the amount you want to add</p>
            </div>
            <div class="col-md-4 text-center mb-3">
              <div class="step-number">2</div>
              <h5>Validate Payment</h5>
              <p>Complete the payment securely</p>
            </div>
            <div class="col-md-4 text-center mb-3">
              <div class="step-number">3</div>
              <h5>Instant Credit</h5>
              <p>Your credit is immediately available</p>
            </div>
          </div>
        </div>
      </div>

      <div class="card mb-4">
        <div class="card-body">
          <h2 class="card-title">Where to buy credit?</h2>
          <p>You can recharge your Maore Mobile credit at one of our reseller locations in Mayotte. Visit the Resellers page to find the nearest point of sale to you.</p>
          <div class="text-center">
            <a href="/en/resellers" class="btn btn-primary btn-lg">Find a Reseller</a>
          </div>
        </div>
      </div>

      <div class="card">
        <div class="card-body">
          <h3>Contact Information</h3>
          <div class="row">
            <div class="col-md-6">
              <p><strong>Customer Service:</strong></p>
              <p><img src="/img/phone.svg" alt="Phone" class="mr-2" style="width: 20px;"> 06 39 900 900</p>
              <p>Mon-Fri 9am-6pm</p>
            </div>
            <div class="col-md-6">
              <p><strong>Other Contacts:</strong></p>
              <p>Email: contact@maoremobile.yt</p>
              <p>Website: www.maoremobile.yt</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<style>
.hero {
  text-align: center;
}

.step-number {
  width: 60px;
  height: 60px;
  background-color: #34af4f;
  color: white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  font-weight: bold;
  margin: 0 auto 20px;
}

.card {
  border: none;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
}

.card-body {
  padding: 30px;
}

.card.h-100 {
  height: 100%;
}

.btn-primary {
  background-color: #34af4f;
  border-color: #34af4f;
}

.btn-primary:hover {
  background-color: #2a8e3f;
  border-color: #2a8e3f;
}

.text-center {
  text-align: center;
}
</style>