fix(home): separate mega-cta from tile-link-overlay (was overlapping with objective)

Before: .tile-link-overlay contained the .mega-cta text. Both overlay and .mega-objective were positioned at the bottom of the tile, causing visual overlap.
After: .mega-cta is a normal-flow <span> in tile-body (pushed to bottom via margin-top: auto). .tile-link-overlay is now an empty click target (no inner content, no padding, no flex).

src/pages/index.astro

@@ -210,9 +210,8 @@ const featuredPortfolio = portfolio.filter(p =>
                 <span class="objective-label">เป้าหมาย:</span>
                 <span class="objective-value">{copy.objective}</span>
               </div>
-              <a href={`/services/${s.id}`} class="tile-link-overlay">
-                <span class="mega-cta">ดูรายละเอียด →</span>
-              </a>
+              <span class="mega-cta">ดูรายละเอียด →</span>
+              <a href={`/services/${s.id}`} class="tile-link-overlay" aria-label={`ดูรายละเอียด ${s.data.title}`}></a>
             </BentoTile>
           );
         })}

src/styles/global.css

@@ -854,15 +854,9 @@ p {
   position: absolute;
   inset: 0;
   z-index: 1;
+  display: block;
   text-decoration: none;
   color: inherit;
-  display: flex;
-  align-items: flex-end;
-  padding: 32px;
-}
-.tile-link-overlay .mega-cta {
-  margin-top: 0;
-  font-weight: 700;
 }
 .bento-tile > *:not(.tile-link-overlay) {
   position: relative;