Transform Your Revenue Operations

<!--
  templateType: page
  isAvailableForNewContent: true
  label: Home
  screenshotPath: ../images/template-previews/home.png
-->
{% extends "./layouts/base.html" %}

{# Preload the hero background image — it's emitted as generated CSS by the
   dnd_section below, so the browser would otherwise discover it late (P5). #}
{% block head_extra %}
  <link rel="preload" as="image" href="{{ get_asset_url('../images/sample/hero-main.jpg') }}" fetchpriority="high">
{% endblock %}

{% block body %}
<div id="main-content" class="body-container-wrapper">

{% dnd_area "dnd_area"
  label="Main section",
  class="body-container body-container--home"
%}

  {# Hero banner with dark background and white text #}
  {% dnd_section
    background_image={
      "backgroundPosition": "MIDDLE_CENTER",
      "backgroundSize": "cover",
      "imageUrl": get_asset_url("../images/sample/hero-main.jpg")
    },
    padding={
      "default": {"top": 120, "bottom": 120},
      "mobile": {"top": 60, "bottom": 60}
    },
    vertical_alignment="MIDDLE"
  %}
    {% dnd_column %}
      {% dnd_row %}
        {% dnd_module "hero_content"
          path="@hubspot/rich_text",
          label="Hero Content"
        %}
          {% module_attribute "html" %}
            <div style="text-align: center; color: #ffffff;">
              <h1 style="margin-bottom: 1.5rem; font-weight: 700; text-shadow: 2px 2px 4px rgba(0,0,0,0.5);">Transform Your Revenue Operations</h1>
              <p style="font-size: clamp(1.125rem, 2.5vw, 1.5rem); margin-bottom: 2rem; max-width: 800px; margin-left: auto; margin-right: auto; text-shadow: 1px 1px 2px rgba(0,0,0,0.5);">Unlock the full potential of HubSpot with expert RevOps strategies that drive predictable growth</p>
            </div>
          {% end_module_attribute %}
        {% end_dnd_module %}
      {% end_dnd_row %}
      {% dnd_row %}
        {% dnd_module "hero_button"
          path="../modules/button.module",
          label="Hero Button",
          button_text="Get Started Today"
        %}
        {% end_dnd_module %}
      {% end_dnd_row %}
    {% end_dnd_column %}
  {% end_dnd_section %}

  {# Product showcase section #}
  {% dnd_section
    padding={
      "default": {"top": 80, "bottom": 80}
    },
    vertical_alignment="MIDDLE"
  %}
    {% dnd_column %}
      {% dnd_row vertical_alignment="MIDDLE" %}
        {% dnd_module "product_content"
          path="@hubspot/rich_text",
          label="Product Content",
          width=6
        %}
          {% module_attribute "html" %}
            <h2>Transform Your Business</h2>
            <p>Experience the next generation of digital innovation with our cutting-edge solutions designed to scale with your ambitions.</p>
            <ul>
              <li>✓ Lightning-fast performance</li>
              <li>✓ Enterprise-grade security</li>
              <li>✓ 24/7 dedicated support</li>
              <li>✓ Seamless integration</li>
            </ul>
          {% end_module_attribute %}
        {% end_dnd_module %}
        {% dnd_module "product_image"
          path="@hubspot/image",
          label="Product Image",
          width=6,
          offset=6,
          img={
            "src": get_asset_url("../images/sample/product-showcase.jpg"),
            "alt": "Product showcase demonstration",
            "size_type": "auto"
          }
        %}
        {% end_dnd_module %}
      {% end_dnd_row %}
    {% end_dnd_column %}
  {% end_dnd_section %}

  {# Solutions cards section #}
  {% dnd_section
    padding={
      "default": {"top": 80, "bottom": 80}
    }
  %}
    {% dnd_column %}
      {% dnd_row %}
        {% dnd_module "solutions_header" path="@hubspot/rich_text", label="Solutions Header" %}
          {% module_attribute "html" %}
            <h2 style="text-align: center;">Our Solutions</h2>
            <p style="text-align: center;">Tailored solutions for every business need</p>
          {% end_module_attribute %}
        {% end_dnd_module %}
      {% end_dnd_row %}
      {% dnd_row %}
        {% dnd_module "solutions_cards"
          path="../modules/cards-grid.module",
          label="Solutions Cards",
          style={
            "card_variant": "default",
            "cols_desktop": "3",
            "cols_tablet": "2",
            "cols_mobile": "1"
          },
          cards=[
            {
              "image": {
                "src": get_asset_url("../images/sample/solution-small-business.jpg"),
                "alt": "Small business team working together",
                "size_type": "auto",
                "loading": "lazy"
              },
              "image_alt": "Small business team working together",
              "title": "Small Business",
              "content": "<p>Streamlined solutions designed for growing businesses. Get enterprise-level capabilities at a price that makes sense for your budget.</p>",
              "cta_text": "Learn More",
              "cta_url": { "href": "#small-business" }
            },
            {
              "image": {
                "src": get_asset_url("../images/sample/solution-enterprise.jpg"),
                "alt": "Enterprise office building",
                "size_type": "auto",
                "loading": "lazy"
              },
              "image_alt": "Enterprise office building",
              "title": "Enterprise",
              "content": "<p>Robust, scalable solutions built for complex organizations. Handle millions of transactions with ease and reliability.</p>",
              "cta_text": "Learn More",
              "cta_url": { "href": "#enterprise" }
            },
            {
              "image": {
                "src": get_asset_url("../images/sample/solution-education.jpg"),
                "alt": "Students in a classroom",
                "size_type": "auto",
                "loading": "lazy"
              },
              "image_alt": "Students in a classroom",
              "title": "Education",
              "content": "<p>Purpose-built tools for educational institutions. Manage students, courses, and outcomes effectively.</p>",
              "cta_text": "Learn More",
              "cta_url": { "href": "#education" }
            }
          ]
        %}
        {% end_dnd_module %}
      {% end_dnd_row %}
    {% end_dnd_column %}
  {% end_dnd_section %}

  {# Testimonials section with cards #}
  {% dnd_section
    padding={
      "default": {"top": 80, "bottom": 80}
    }
  %}
    {% dnd_column %}
      {% dnd_row %}
        {% dnd_module "testimonials_header" path="@hubspot/rich_text", label="Testimonials Header" %}
          {% module_attribute "html" %}
            <h2 style="text-align: center;">What Our Clients Say</h2>
            <p style="text-align: center;">Trusted by businesses worldwide</p>
          {% end_module_attribute %}
        {% end_dnd_module %}
      {% end_dnd_row %}
      {% dnd_row %}
        {% dnd_module "testimonials_cards"
          path="../modules/cards-grid.module",
          label="Testimonials Cards",
          style={
            "card_variant": "default",
            "cols_desktop": "4",
            "cols_tablet": "2",
            "cols_mobile": "1"
          },
          cards=[
            {
              "image": {
                "src": get_asset_url("../images/sample/testimonial-sarah.jpg"),
                "alt": "Profile picture of Sarah Johnson",
                "size_type": "auto",
                "loading": "lazy"
              },
              "image_alt": "Profile picture of Sarah Johnson",
              "title": "Sarah Johnson",
              "eyebrow": "CEO, TechCorp",
              "content": "<p><em>'This solution transformed our operations completely. The ROI was evident within the first quarter, and our team productivity increased by 40%.'</em></p>"
            },
            {
              "image": {
                "src": get_asset_url("../images/sample/testimonial-michael.jpg"),
                "alt": "Profile picture of Michael Chen",
                "size_type": "auto",
                "loading": "lazy"
              },
              "image_alt": "Profile picture of Michael Chen",
              "title": "Michael Chen",
              "eyebrow": "Director of Operations, GlobalTech",
              "content": "<p><em>'Outstanding support and incredible results. The implementation was seamless and the ongoing support has been exceptional.'</em></p>"
            },
            {
              "image": {
                "src": get_asset_url("../images/sample/testimonial-emma.jpg"),
                "alt": "Profile picture of Emma Williams",
                "size_type": "auto",
                "loading": "lazy"
              },
              "image_alt": "Profile picture of Emma Williams",
              "title": "Emma Williams",
              "eyebrow": "VP Marketing, StartupCo",
              "content": "<p><em>'Game-changing platform that delivered beyond our expectations. We've seen 3x growth since implementation.'</em></p>"
            },
            {
              "image": {
                "src": get_asset_url("../images/sample/testimonial-david.jpg"),
                "alt": "Profile picture of David Martinez",
                "size_type": "auto",
                "loading": "lazy"
              },
              "image_alt": "Profile picture of David Martinez",
              "title": "David Martinez",
              "eyebrow": "CTO, InnovateTech",
              "content": "<p><em>'The best investment we've made in our digital infrastructure. Highly recommend to any growing business.'</em></p>"
            }
          ]
        %}
        {% end_dnd_module %}
      {% end_dnd_row %}
    {% end_dnd_column %}
  {% end_dnd_section %}

  {# Features section #}
  {% dnd_section
    padding={
      "default": {"top": 80, "bottom": 80}
    }
  %}
    {% dnd_column %}
      {% dnd_row %}
        {% dnd_module "features_header" path="@hubspot/rich_text", label="Features Header" %}
          {% module_attribute "html" %}
            <h2 style="text-align: center;">Why Choose Us</h2>
            <p style="text-align: center;">Industry-leading features that set us apart</p>
          {% end_module_attribute %}
        {% end_dnd_module %}
      {% end_dnd_row %}
      {% dnd_row %}
        {% dnd_module "features_cards"
          path="../modules/cards-grid.module",
          label="Features Cards",
          style={
            "card_variant": "minimal",
            "cols_desktop": "3",
            "cols_tablet": "2",
            "cols_mobile": "1",
            "image_max_width_type": "percent",
            "image_max_width_percent": 75
          },
          cards=[
            {
              "image": {
                "src": get_asset_url("../images/icons/icon-analytics.svg"),
                "alt": "Analytics icon",
                "size_type": "auto",
                "loading": "lazy"
              },
              "image_alt": "Analytics icon",
              "title": "Advanced Analytics",
              "content": "<p>Real-time insights and comprehensive reporting dashboards to track every metric that matters to your business.</p>"
            },
            {
              "image": {
                "src": get_asset_url("../images/icons/icon-security.svg"),
                "alt": "Security shield icon",
                "size_type": "auto",
                "loading": "lazy"
              },
              "image_alt": "Security shield icon",
              "title": "Enterprise Security",
              "content": "<p>Bank-level encryption and security protocols to keep your data safe and compliant with global standards.</p>"
            },
            {
              "image": {
                "src": get_asset_url("../images/icons/icon-api.svg"),
                "alt": "API connection icon",
                "size_type": "auto",
                "loading": "lazy"
              },
              "image_alt": "API connection icon",
              "title": "Powerful API",
              "content": "<p>Seamlessly integrate with your existing tools and workflows with our comprehensive REST API.</p>"
            },
            {
              "image": {
                "src": get_asset_url("../images/icons/icon-support.svg"),
                "alt": "Support headset icon",
                "size_type": "auto",
                "loading": "lazy"
              },
              "image_alt": "Support headset icon",
              "title": "24/7 Support",
              "content": "<p>Round-the-clock expert support to ensure your operations never skip a beat.</p>"
            },
            {
              "image": {
                "src": get_asset_url("../images/icons/icon-global.svg"),
                "alt": "Global network icon",
                "size_type": "auto",
                "loading": "lazy"
              },
              "image_alt": "Global network icon",
              "title": "Global Scale",
              "content": "<p>Infrastructure that scales with your business across multiple regions and time zones.</p>"
            },
            {
              "image": {
                "src": get_asset_url("../images/icons/icon-ai.svg"),
                "alt": "Artificial intelligence icon",
                "size_type": "auto",
                "loading": "lazy"
              },
              "image_alt": "Artificial intelligence icon",
              "title": "AI-Powered",
              "content": "<p>Leverage artificial intelligence to automate workflows and predict trends before they happen.</p>"
            }
          ]
        %}
        {% end_dnd_module %}
      {% end_dnd_row %}
    {% end_dnd_column %}
  {% end_dnd_section %}

  {# CTA Section #}
  {% dnd_section
    padding={
      "default": {"top": 80, "bottom": 80}
    }
  %}
    {% dnd_column %}
      {% dnd_row %}
        {% dnd_module "cta_content" path="@hubspot/rich_text", label="CTA Content" %}
          {% module_attribute "html" %}
            <div style="text-align: center;">
              <h2 style="font-size: 2.5rem; margin-bottom: 1rem;">Ready to Get Started?</h2>
              <p style="font-size: 1.25rem; margin-bottom: 2rem;">Join thousands of businesses already growing with our platform</p>
            </div>
          {% end_module_attribute %}
        {% end_dnd_module %}
      {% end_dnd_row %}
      {% dnd_row %}
        {% dnd_module "cta_button"
          path="../modules/button.module",
          label="CTA Button",
          button_text="Start Your Free Trial"
        %}
        {% end_dnd_module %}
      {% end_dnd_row %}
    {% end_dnd_column %}
  {% end_dnd_section %}

{% end_dnd_area %}
</div>
{% endblock body %}