<%- include('partials/header', { title: 'Contact Us' }) %>

<div style="padding-top:100px; background:var(--bg); min-height:100vh;">
  <div class="container">
    <div class="contact-grid">

      <!-- INFO ─────────────────────────────────── -->
      <div>
        <div class="contact-info-label">Let's talk</div>
        <h1 class="contact-title">
          Join hundreds already<br>
          growing <em>faster.</em>
        </h1>
        <p class="contact-body">Book a free 30-minute mentor call or send us a message. We'll help you figure out if Ecobe Academy is the right fit — and which program makes sense for your situation.</p>

        <div class="contact-details">
          <div class="contact-detail">
            <div class="contact-detail-icon"><span class="material-icons">email</span></div>
            <span><a href="mailto:ecobe@ecobeacademy.com">ecobe@ecobeacademy.com</a></span>
          </div>
          <div class="contact-detail">
            <div class="contact-detail-icon"><span class="material-icons">calendar_today</span></div>
            <span><a href="https://calendly.com/miriamscioratto/30min" target="_blank">Book a free 30-min call on Calendly</a></span>
          </div>
          <div class="contact-detail">
            <div class="contact-detail-icon"><span class="material-icons">link</span></div>
            <span><a href="https://www.linkedin.com/company/ecobe-academy" target="_blank">Connect on LinkedIn</a></span>
          </div>
          <div class="contact-detail">
            <div class="contact-detail-icon"><span class="material-icons">smart_display</span></div>
            <span><a href="https://www.youtube.com/@ecobeacademy" target="_blank">Watch us on YouTube</a></span>
          </div>
        </div>

        <div class="next-steps" style="margin-top:48px;">
          <div class="next-steps-label">What happens after you reach out</div>
          <div class="next-step">
            <div class="next-step-num">1</div>
            <div class="next-step-text">We review your message and background within 24 hours</div>
          </div>
          <div class="next-step">
            <div class="next-step-num">2</div>
            <div class="next-step-text">We schedule a free 30-minute call to understand your situation</div>
          </div>
          <div class="next-step">
            <div class="next-step-num">3</div>
            <div class="next-step-text">We recommend the right program — no pressure, no hard sell</div>
          </div>
        </div>
      </div>

      <!-- FORM ────────────────────────────────── -->
      <div>
        <div class="contact-form-box">
          <div class="contact-form-title">Send us a message</div>
          <p class="contact-form-sub">Or email us directly at <a href="mailto:ecobe@ecobeacademy.com" style="color:var(--emerald);">ecobe@ecobeacademy.com</a></p>

          <form id="contactForm">
            <div class="form-group">
              <label class="form-label" for="name">Your name</label>
              <input class="form-input" type="text" id="name" name="name" placeholder="Jane Smith" required>
            </div>
            <div class="form-group">
              <label class="form-label" for="email">Email address</label>
              <input class="form-input" type="email" id="email" name="email" placeholder="jane@example.com" required>
            </div>
            <div class="form-group">
              <label class="form-label" for="message">Tell us about your situation</label>
              <textarea class="form-textarea" id="message" name="message" placeholder="Where are you in your job search? What are you aiming for? What's the biggest challenge right now?" rows="5"></textarea>
            </div>
            <div class="form-checkbox">
              <input type="checkbox" id="newsletter" name="newsletter">
              <label for="newsletter">Sign up to receive weekly insights on the EU hiring market and advice from HR professionals.</label>
            </div>
            <button type="submit" class="btn btn-primary" style="width:100%; justify-content:center;">Send Message →</button>
          </form>

          <div class="form-success" id="formSuccess">
            <span class="material-icons" style="font-size:16px;vertical-align:middle;color:var(--emerald);">check_circle</span> Message received. We'll be in touch within 24 hours.
          </div>

          <div style="margin-top:28px; padding-top:24px; border-top:1px solid var(--border); text-align:center;">
            <p style="font-size:13px; color:var(--text-muted); margin-bottom:14px;">Prefer to book directly?</p>
            <a href="https://calendly.com/miriamscioratto/30min" target="_blank" class="btn btn-outline" style="width:100%; justify-content:center;">Book a Free Mentor Call →</a>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- FOUNDER SECTION ────────────────────────────── -->
<section class="founder-section">
  <div class="container">
    <div class="founder-grid reveal">
      <div class="founder-avatar">G</div>
      <div>
        <div class="founder-label">A word from our founder</div>
        <div class="founder-quote">"With 20+ years in HR, I've hired over 1,000 professionals and designed 8,000+ career growth plans — across Rio, London, and Geneva."</div>
        <p class="founder-text">I've witnessed how dramatically the job market has changed, and I felt it was my duty to help mid-level and senior professionals prepare for it — all whilst planting one tree in the Amazon Rainforest to celebrate each person's achievement. That is the vision of Ecobe Academy.</p>
        <p class="founder-text">After reaching my own professional goals and net-zero carbon emissions, I founded Ecobe Academy to help professionals future-proof their careers with AI, sustainability, and strategies that create impact beyond a job title.</p>
        <p class="founder-text">I hope to see you on that journey soon.</p>
        <div class="founder-sig">Giuliano.</div>
        <div style="margin-top:24px;">
          <a href="https://www.linkedin.com/in/giuliano-hippertt/" target="_blank" class="mentor-linkedin">Connect with Giuliano on LinkedIn →</a>
        </div>
      </div>
    </div>
  </div>
</section>

<%- include('partials/footer') %>
