Improve details view

script.js

···
 
     const card = document.createElement('activity-card');
     card.post = post;
+    card.hideLink = true;
     shadow.querySelector('.detail-page').appendChild(card);
   }
 }
···
 //        container.appendChild(el);
 class ActivityCard extends HTMLElement {
   set post(value) { this._post = value; }
+  set hideLink(value) { this._hideLink = value; }
 
   connectedCallback() {
     const shadow = this.attachShadow({ mode: 'open' });
···
             ${showElevation ? `<span>📈 ${post.stats.elevation}m elev</span>` : ''}
             <span>📍 ${post.location?.name ?? '—'}</span>
           </div>
-          <a class="view-link" href="?view=post&id=${post.rkey}">View post →</a>
+          ${!this._hideLink ? `<a class="view-link" href="?view=post&id=${post.rkey}">View post →</a>` : ''}
         </div>
       </div>
     `;
···
             </div>
           </div>
           <p class="caption">${post.text ?? 'No description'}</p>
-          <a class="view-link" href="?view=post&id=${post.rkey}">View post →</a>
+          ${!this._hideLink ? `<a class="view-link" href="?view=post&id=${post.rkey}">View post →</a>` : ''}
         </div>
       </div>
     `;
···
     const card = document.createElement('trail-card');
     card.trail = trail;
     card.trailKey = trail.rkey;
+    card.hideLink = true;
     shadow.querySelector('.detail-page').appendChild(card);
+
+    const relatedPosts = data.posts.filter(p => p.trail?.rkey === this._trailId);
+    if (relatedPosts.length > 0) {
+      const heading = document.createElement('h3');
+      heading.className = 'detail-section-heading';
+      heading.textContent = 'Posts on this trail';
+      shadow.querySelector('.detail-page').appendChild(heading);
+
+      for (const post of relatedPosts) {
+        const postCard = document.createElement('activity-card');
+        postCard.post = post;
+        shadow.querySelector('.detail-page').appendChild(postCard);
+      }
+    }
   }
 }
 
···
   set trailKey(value) {
     this._trailKey = value;
   }
+  set hideLink(value) { this._hideLink = value; }
 
   connectedCallback() {
     this._render();
···
         <div class="trail-map"></div>
         <div class="card-body">
           <div class="trail-info">
-            <a class="view-link" href="?view=trail&id=${this._trailKey}">View trail →</a>
+            ${!this._hideLink ? `<a class="view-link" href="?view=trail&id=${this._trailKey}">View trail →</a>` : ''}
           </div>
         </div>
       </div>

styles.css

···
   margin-top: 2rem;
 }
 
+.detail-section-heading {
+  font-size: 0.95rem;
+  font-weight: 600;
+  color: var(--color-text-secondary, #666);
+  margin: 1.5rem 0 0.75rem;
+  padding: 0;
+}
+
 /* ── Card view links ──────────────────────────────────────────── */
 .view-link {
   display: inline-block;