{% if announcement %}
<div class="announcement" role="region" aria-label="Announcement" id="site-announcement">
  <div class="announcement-inner">
    <div class="announcement-content">
      <span class="announcement-title">{{ announcement.message|cut:"."|upper }}</span>
      <span class="announcement-dot" aria-hidden="true">&bull;</span>
      <div class="announcement-actions">
        <span class="announcement-tag">Open for Diploma Engineers</span>
        {% if announcement.link_url %}
          <a class="announcement-btn" href="{{ announcement.link_url }}">
            <span>{{ announcement.link_text|default:"Enquire Now"|upper }}</span>
            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><line x1="5" y1="12" x2="19" y2="12"/><polyline points="12 5 19 12 12 19"/></svg>
          </a>
        {% endif %}
      </div>
    </div>
    <button class="announcement-close" aria-label="Close announcement" onclick="document.getElementById('site-announcement').style.display='none';">&times;</button>
  </div>
</div>
{% endif %}