product-landing page and banner for Firefox for Enterprise

kitsune/products/jinja2/products/includes/topic_macros.html

@@ -56,23 +56,31 @@ <h3 class="card--title">
             </g>
           </svg>
 
-          {{ _('Still need help?') }}
+          {% if product.slug == 'firefox-enterprise' %}
+            {{ _('Get Help') }}
+          {% else %}
+            {{ _('Still need help?') }}
+          {% endif %}
         </h3>
         <p class="card--desc">
-          {% if product and product.has_ticketing_support %}
-            {{ _('We’re here for you! If you haven’t found a solution after exploring our help articles, you can get in touch with our support team.') }}
+          {% if product.slug == 'firefox-enterprise' %}
+            {{ _('If you\'re a Firefox Support for Organizations admin, contact us for technical assistance, deployment guidance, and priority help.') }}
+          {% elif product.has_ticketing_support %}
+            {{ _('We\'re here for you! If you haven\'t found a solution after exploring our help articles, you can get in touch with our support team.') }}
           {% else %}
-            {{ _('We’re here for you. Post a question to our support forums and get answers from our community of experts.') }}
+            {{ _('We\'re here for you. Post a question to our support forums and get answers from our community of experts.') }}
           {% endif %}
         </p>
         <a class="sumo-button primary-button button-lg"
-          href="{{ url('questions.aaq_step2', product_slug=product.slug) }}"
+          href="{% if product.slug == 'firefox-enterprise' %}{{ url('questions.aaq_step3', product_slug=product.slug) }}{% else %}{{ url('questions.aaq_step2', product_slug=product.slug) }}{% endif %}"
           data-event-name="link_click"
           data-event-parameters='{
-            "link_name": "aaq-banner.aaq-step-2",
+            "link_name": "{% if product.slug == 'firefox-enterprise' %}enterprise-banner.aaq-step-3{% else %}aaq-banner.aaq-step-2{% endif %}",
             "link_detail": "{{ product.slug }}"
           }'>
-          {% if product and product.has_ticketing_support %}
+          {% if product.slug == 'firefox-enterprise' %}
+            {{ _('Contact Support') }}
+          {% elif product.has_ticketing_support %}
             {{ _('Get Support') }}
           {% else %}
             {{ _('Ask the Community') }}

kitsune/products/jinja2/products/product.html

@@ -17,7 +17,7 @@
 {% block hidden_search_masthead %}{% endblock %}
 
 {% block masthead %}
-<section class="home-search-section sumo-page-section extra-pad-bottom shade-bg">
+<section class="home-search-section sumo-page-section extra-pad-bottom shade-bg product-{{ product.slug }}">
 
   <div class="mzp-l-content">
 
@@ -112,6 +112,11 @@ <h1 class="sumo-page-heading-xl">
     </div>
   </div>
 </section>
+
+{% if product.slug == 'firefox-enterprise' %}
+  {{ topic_metadata(topics, product=product) }}
+{% endif %}
+
 {% endblock %}
 
 {% block contentwrap %}
@@ -147,7 +152,9 @@ <h2 class="sumo-page-subheading">{{ _('Topics') }}</h2>
     {{ help_topics(topics) }}
   </div>
 
+  {% if product.slug != 'firefox-enterprise' %}
   {{ topic_metadata(topics, product=product) }}
+  {% endif %}
 
 {% if featured %}
   <section class="mzp-l-content mzp-l-content sumo-page-section--inner">

kitsune/sumo/static/sumo/scss/layout/_products.scss

@@ -1,6 +1,67 @@
 @use '../config' as c;
 @use 'protocol/css/includes/lib' as p;
 
+// Firefox Enterprise product landing page background
+.home-search-section.product-firefox-enterprise {
+  position: relative;
+  overflow: hidden;
+
+    &::before {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      max-height: 793px;
+      background-image: url('../../sumo/img/ent-noodles.svg');
+      background-repeat: no-repeat;
+      background-position: top left;
+      background-size: 170% 100%;
+      pointer-events: none;
+      z-index: 0;
+    }
+
+    // Ensure content stays above the background
+    > * {
+      position: relative;
+      z-index: 1;
+    }
+
+    // White text for all elements over the colored background
+    .sumo-page-heading-xl,
+    .product-title-text,
+    .popular-searches,
+    #main-breadcrumbs,
+    .breadcrumbs {
+      color: #ffffff;
+    }
+
+    #main-breadcrumbs a,
+    .breadcrumbs a {
+      color: #ffffff;
+
+      &:hover {
+        color: rgba(255, 255, 255, 0.8);
+      }
+    }
+
+    .popular-searches a {
+      color: #ffffff;
+      text-decoration-color: rgba(255, 255, 255, 0.6);
+
+      &:hover {
+        text-decoration-color: #ffffff;
+      }
+    }
+
+  // Enhance search box visibility
+  .searchbox {
+    background: #ffffff;
+    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
+  }
+}
+
 .sumo-page-subheader {
   display: flex;
   flex-direction: column-reverse;
@@ -79,4 +140,4 @@
       }
     }
   }
-}
+}