fix(public): keep the early-access CTA in the first viewport on Promptly/Drishti mobile heroes

public/drishti/index.html

@@ -99,7 +99,7 @@
 
     <main id="main" class="page-main">
       <div class="shell page-shell">
-        <section class="page-hero-card reveal">
+        <section class="page-hero-card product-hero reveal">
           <div>
             <p class="eyebrow">Drishti</p>
             <div class="app-status"><span class="dot" aria-hidden="true"></span> Mindful pause before distraction</div>

public/promptly/index.html

@@ -99,7 +99,7 @@
 
     <main id="main" class="page-main">
       <div class="shell page-shell">
-        <section class="page-hero-card reveal">
+        <section class="page-hero-card product-hero reveal">
           <div>
             <p class="eyebrow">Promptly</p>
             <div class="app-status"><span class="dot" aria-hidden="true"></span> Booking + no-show prevention</div>

public/styles.css

@@ -908,6 +908,26 @@ h4 {
     padding: 36px 0 44px;
   }
 
+  /* Product heroes (Promptly, Drishti) carry sentence-length h1s that the
+     global narrow-column h1 cap (9ch) balloons into ~8-10 stacked lines on
+     mobile, pushing the primary early-access CTA below the first viewport.
+     Let the product h1 wrap wider and scale down so the CTA surfaces in the
+     first useful viewport (design-system hard gate). */
+  .product-hero h1 {
+    max-width: none;
+    font-size: clamp(2rem, 8vw, 3.4rem);
+  }
+
+  .product-hero .page-lead {
+    margin-top: 14px;
+    font-size: 0.95rem;
+    line-height: 1.5;
+  }
+
+  .product-hero .action-row {
+    margin-top: 20px;
+  }
+
   .info-card {
     padding: 22px 20px 24px;
   }