<script type="application/ld+json">
<%
  const _appUrl2 = process.env.APP_URL || 'https://biz2bizchamber.com';
  const _article = {
    "@context": "https://schema.org",
    "@type": "NewsArticle",
    "headline": release.title,
    "description": release.excerpt || '',
    "url": _appUrl2 + '/newsroom/' + release.id,
    "datePublished": release.published_at,
    "image": release.image ? (release.image.startsWith('http') ? release.image : _appUrl2 + release.image) : undefined,
    "publisher": {
      "@type": "Organization",
      "name": release.org_name,
      "logo": release.logo ? { "@type": "ImageObject", "url": release.logo.startsWith('http') ? release.logo : _appUrl2 + release.logo } : undefined
    },
    "author": { "@type": "Organization", "name": release.org_name }
  };
  if (!_article.image) delete _article.image;
  if (!_article.publisher.logo) delete _article.publisher.logo;
%>
<%- JSON.stringify(_article, null, 2) %>
</script>

<section class="page-hero page-hero-sm">
  <div class="container">
    <div style="display:flex;align-items:center;gap:12px;margin-bottom:12px">
      <% if (release.logo) { %><img src="<%= release.logo %>" alt="<%= release.org_name %>" style="width:36px;height:36px;border-radius:6px;object-fit:contain;background:#fff;padding:2px"><% } %>
      <span style="font-size:.875rem;opacity:.85"><%= release.org_name %></span>
    </div>
    <h1 style="max-width:760px;line-height:1.3"><%= release.title %></h1>
    <p style="opacity:.75;font-size:.9rem;margin-top:10px">
      <i class="bi bi-calendar3"></i> <%= new Date(release.published_at).toLocaleDateString('en-US',{weekday:'long',year:'numeric',month:'long',day:'numeric'}) %>
      &nbsp;·&nbsp; <i class="bi bi-newspaper"></i> Press Release
    </p>
  </div>
</section>

<div class="biz-breadcrumb">
  <div class="container">
    <a href="/">Home</a> <i class="bi bi-chevron-right"></i>
    <a href="/newsroom">Newsroom</a> <i class="bi bi-chevron-right"></i>
    <span><%= release.title.length > 60 ? release.title.substring(0,60) + '…' : release.title %></span>
  </div>
</div>

<section class="section" style="padding-top:32px">
  <div class="container">
    <div style="display:grid;grid-template-columns:1fr minmax(0,680px) 1fr;gap:0">
      <div></div>
      <article>
        <% if (release.image) { %>
        <img src="<%= release.image %>" alt="<%= release.title %>" style="width:100%;border-radius:12px;margin-bottom:28px;object-fit:cover;max-height:420px">
        <% } %>

        <% if (release.excerpt) { %>
        <p style="font-size:1.1rem;color:#374151;line-height:1.7;font-weight:500;margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid #e5e7eb"><%= release.excerpt %></p>
        <% } %>

        <div style="font-size:.95rem;color:#374151;line-height:1.8">
          <%- (release.content || '').replace(/\n\n/g,'</p><p>').replace(/\n/g,'<br>').replace(/^/,'<p>').replace(/$/,'</p>') %>
        </div>

        <!-- Tags / distribution -->
        <% if (release.distribution_channels) { %>
        <% const channels = typeof release.distribution_channels === 'string' ? JSON.parse(release.distribution_channels || '[]') : (release.distribution_channels || []); %>
        <% if (channels.length) { %>
        <div style="margin-top:28px;padding-top:20px;border-top:1px solid #e5e7eb">
          <span style="font-size:.75rem;color:#9ca3af;text-transform:uppercase;letter-spacing:.06em;font-weight:600">Distributed via</span>
          <div style="display:flex;gap:8px;flex-wrap:wrap;margin-top:8px">
            <% channels.forEach(ch => { %><span style="font-size:.8rem;padding:4px 12px;background:#f3f4f6;border-radius:20px;color:#374151"><%= ch %></span><% }) %>
          </div>
        </div>
        <% } %>
        <% } %>

        <!-- About the business -->
        <div style="margin-top:36px;padding:24px;background:#f9fafb;border-radius:12px;border:1px solid #e5e7eb">
          <div style="display:flex;align-items:center;gap:12px;margin-bottom:12px">
            <% if (release.logo) { %><img src="<%= release.logo %>" alt="<%= release.org_name %>" style="width:40px;height:40px;border-radius:8px;object-fit:contain;background:#fff;padding:2px;border:1px solid #e5e7eb"><% } %>
            <div>
              <p style="font-size:.7rem;color:#9ca3af;margin:0;text-transform:uppercase;letter-spacing:.05em">About the Author</p>
              <p style="font-weight:700;font-size:.95rem;margin:0"><%= release.org_name %></p>
            </div>
          </div>
          <a href="/directory/<%= release.org_slug %>" style="font-size:.85rem;color:#1a56db;text-decoration:none;font-weight:500"><i class="bi bi-building"></i> View Business Profile <i class="bi bi-arrow-right"></i></a>
        </div>

        <div style="margin-top:24px;display:flex;gap:12px;align-items:center">
          <a href="/newsroom" class="btn btn-outline-primary btn-sm"><i class="bi bi-arrow-left"></i> Back to Newsroom</a>
          <button onclick="navigator.share ? navigator.share({title:document.title,url:location.href}) : navigator.clipboard.writeText(location.href).then(()=>alert('Link copied!'))" class="btn btn-ghost btn-sm"><i class="bi bi-share"></i> Share</button>
        </div>
      </article>
      <div></div>
    </div>
  </div>
</section>
