Website: Add fun ticker on autonomous-endpoint-management.ejs (#46006)

Mostly bc I'm on an airplane, but also there's an opportunity to tell a
more complete story here consisting of not just autopatching, but also
the idea of using AI (and also, like, just modern, intentional tooling)
to move faster


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **Website Updates**
* Updated Autonomous Endpoint Management landing hero headline to a
ticker-style action list ending with "at machine speed" and revised
supporting paragraph to "Manage, patch, and secure machines at exploit
speed. Humans approve every change."
* Added an animated ticker in the hero that cycles highlighted actions
for visual emphasis and improved messaging impact.

<!-- review_stack_entry_start -->

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/fleetdm/fleet/pull/46006?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack)

<!-- review_stack_entry_end -->
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---

Built for [Mike
McNeil](https://fleetdm.slack.com/archives/D0AFASLRHNU/p1779393939473749?thread_ts=1779227314.466229&cid=D0AFASLRHNU)
by [Kilo for Slack](https://kilo.ai/slack)

---------

Co-authored-by: kiloconnect[bot] <240665456+kiloconnect[bot]@users.noreply.github.com>

website/assets/js/pages/landing-pages/autonomous-endpoint-management.page.js

@@ -13,13 +13,36 @@ parasails.registerPage('autonomous-endpoint-management', {
     //…
   },
   mounted: async function() {
-    //…
+    this.animateTicker();
   },
 
   //  ╦╔╗╔╔╦╗╔═╗╦═╗╔═╗╔═╗╔╦╗╦╔═╗╔╗╔╔═╗
   //  ║║║║ ║ ║╣ ╠╦╝╠═╣║   ║ ║║ ║║║║╚═╗
   //  ╩╝╚╝ ╩ ╚═╝╩╚═╩ ╩╚═╝ ╩ ╩╚═╝╝╚╝╚═╝
   methods: {
+    animateTicker: function() {
+      setInterval(()=>{
+        let currentTickerOption = $('[purpose="ticker-option"].visible');
+        if(currentTickerOption) {
+          if (currentTickerOption.length === 0) {
+            currentTickerOption = $('[purpose="ticker-option"]').first();
+            currentTickerOption.addClass('visible');
+            return;
+          }
+          // [?]:https://api.jquery.com/nextAll/#nextAll-selector
+          let nextTickerOption = currentTickerOption.nextAll('[purpose="ticker-option"]').first();
+          // If we've reached the end of the list, pick the first option to be the next ticker option
+          if (nextTickerOption.length === 0) {
+            nextTickerOption = $('span[purpose="ticker-option"]').first();
+          }
+          currentTickerOption.removeClass('visible').addClass('animating-out');
+          nextTickerOption.addClass('visible');
+          setTimeout(()=>{
+            currentTickerOption.removeClass('animating-out');
+          }, 1000);//œ (note this 1000 had better be less than the 1200 below)
+        }//fi
+      }, 1200);//œ
+    },
     clickOpenVideoModal: function(modalName) {
       this.modal = modalName;
     },

website/assets/styles/pages/landing-pages/autonomous-endpoint-management.less

@@ -62,6 +62,31 @@
       text-align: center;
     }
   }
+  [purpose='ticker-container'] {
+    overflow: hidden;
+    width: fit-content;
+    white-space: nowrap;
+  }
+  [purpose='option-container'] {
+    height: 57.6px;
+  }
+  [purpose='ticker-option'] {
+    color: @core-fleet-black;
+    visibility: hidden;
+    height: 0px;
+    transform: translateY(75px);
+    transition: transform 0.3s ease-in-out;
+    &.visible {
+      visibility: visible;
+      position: relative;
+      transition: transform 0.3s ease-in-out;
+      transform: translateY(0%);
+    }
+    &.animating-out {
+      visibility: visible;
+      transform: translateY(-75px);
+    }
+  }
   [purpose='page-hero-text'] {
     p {
       .body-l();
@@ -648,6 +673,15 @@
         font-size: 32px;
       }
     }
+    [purpose='option-container'] {
+      height: 38.4px;
+    }
+    [purpose='ticker-option'] {
+      transform: translateY(50px);
+      &.animating-out {
+        transform: translateY(-50px);
+      }
+    }
     [purpose='button-row'] {
       flex-direction: column;
       align-items: center;

website/views/pages/landing-pages/autonomous-endpoint-management.ejs

@@ -5,10 +5,28 @@
         <div purpose="page-hero-content">
           <div purpose="page-hero-headings">
             <h4>Autonomous endpoint management</h4>
-            <h1>Patch at exploit speed</h1>
+            <h1>
+              <div purpose="ticker-container" class="d-flex align-items-center mx-auto flex-row text-nowrap">
+                <div purpose="option-container" class="pl-2 d-flex flex-column">
+                  <span purpose="ticker-option" class="visible">Patch</span>
+                  <span purpose="ticker-option">Uninstall</span>
+                  <span purpose="ticker-option">Audit</span>
+                  <span purpose="ticker-option">Offboard</span>
+                  <span purpose="ticker-option">Onboard</span>
+                  <span purpose="ticker-option">Diagnose</span>
+                  <span purpose="ticker-option">Investigate</span>
+                  <span purpose="ticker-option">Fix</span>
+                  <span purpose="ticker-option">Report</span>
+                  <span purpose="ticker-option">Sandbox</span>
+                  <span purpose="ticker-option">Configure</span>
+                  <span purpose="ticker-option">Migrate</span>
+                  <span purpose="ticker-option">Make changes</span>
+                </div>
+              </div> at machine speed
+            </h1>
           </div>
           <div purpose="page-hero-text">
-            <p>Auto-patching at machine speed. Humans approve every change.</p>
+            <p>Manage, patch, and secure machines at exploit speed. Humans approve every change.</p>
           </div>
           <%/* Hero CTA buttons - hidden for now, may re-enable later
           <div purpose="button-row" class="d-flex justify-content-center align-items-center">
@@ -230,7 +248,7 @@
     <div purpose="page-container" class="container">
       <div purpose="bottom-cta" class="text-center">
         <h4>Autonomous endpoint management</h4>
-        <h2>Patch at exploit speed. Without losing sleep.</h2>
+        <h2>Manage devices like it's 2026</h2>
         <div purpose="button-row" style="margin-top: 32px;" class="d-flex justify-content-center align-items-center mx-auto">
           <a purpose="cta-button" class="mr-0" href="/contact" no-underline>Get a demo</a>
         </div>