{% extends "base.html" %} {% block main %}

<main>
  <!-- Hero Section -->
  <section class="hero">
    <h2>Empowering Your Cloud & DevOps Journey</h2>
    <p>
      We specialize in delivering Cloud and DevOps consulting services tailored
      to meet your unique business needs.
    </p>
    <button onclick="window.location.href='{{ url_for('services') }}'">
      Explore our Services
    </button>
  </section>

  <!-- Moving Image Section -->
  <section class="moving-image-container">
    <img
      src="{{ url_for('static', filename='images/image.jpg') }}"
      alt="Moving Image"
      class="moving-image"
    />
  </section>

  <!-- Services Highlights -->
  <section class="services-highlight">
    <h3>Our Key Services</h3>
    <div class="service-cards">
      <div class="card">
        <h4>Cloud Consulting</h4>
        <p>
          Cloud migration, strategy, and optimization tailored for your
          business.
        </p>
        <a href="{{ url_for('services') }}" class="btn-link">Learn More</a>
      </div>
      <div class="card">
        <h4>DevOps Solutions</h4>
        <p>
          CI/CD pipelines, automated infrastructure, and efficient delivery.
        </p>
        <a href="{{ url_for('services') }}" class="btn-link">Learn More</a>
      </div>
      <div class="card">
        <h4>Security & Compliance</h4>
        <p>
          Ensure security and compliance across your cloud and on-premise
          environments.
        </p>
        <a href="{{ url_for('services') }}" class="btn-link">Learn More</a>
      </div>
    </div>
  </section>
  <!--add testimony-->
  <section class="testimonials-carousel">
    <h3>What Our Clients Say</h3>
    <div class="carousel">
      <div class="testimonial active">
        <p>"CDC helped us streamline our cloud migration. Highly recommend!"</p>
        <span>– <strong>Jane D.</strong></span>
      </div>
      <div class="testimonial">
        <p>"Professional, reliable, and skilled team."</p>
        <span>– <strong>TechCorp Inc.</strong></span>
      </div>
      <div class="testimonial">
        <p>"Their DevOps support transformed our infrastructure!"</p>
        <span>– <strong>DevOps Solutions</strong></span>
      </div>
    </div>
  </section>

  <!-- Quick Links Section -->
  <section class="quick-links">
    <h3>Quick Links</h3>
    <ul>
      <li><a href="{{ url_for('services') }}">View Our Services</a></li>
      <li><a href="{{ url_for('contact_form') }}">Contact Form</a></li>
    </ul>
  </section>
</main>

{% endblock main %}
