<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ if and .Title (ne .Title .Site.Title) }}{{ .Title }} - {{ end }}{{ .Site.Title }}</title>
    <meta name="description" content="{{ .Description | default .Site.Params.description }}">
    <link rel="icon" type="image/x-icon" href="/favicon.ico">
    <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">
    
    <!-- Open Graph / Social Media Meta Tags -->
    <meta property="og:title" content="{{ if and .Title (ne .Title .Site.Title) }}{{ .Title }} - {{ end }}{{ .Site.Title }}">
    <meta property="og:description" content="{{ .Description | default .Site.Params.description }}">
    <meta property="og:type" content="website">
    <meta property="og:url" content="{{ .Permalink }}">
    {{ if .Params.image }}<meta property="og:image" content="{{ .Site.BaseURL }}{{ .Params.image }}">{{ end }}
    {{ if .Params.banner }}<meta property="og:image" content="{{ .Site.BaseURL }}{{ .Params.banner }}">{{ end }}
    
    <meta name="twitter:card" content="summary">
    <meta name="twitter:title" content="{{ if and .Title (ne .Title .Site.Title) }}{{ .Title }} - {{ end }}{{ .Site.Title }}">
    <meta name="twitter:description" content="{{ .Description | default .Site.Params.description }}">
    {{ if .Params.image }}<meta name="twitter:image" content="{{ .Site.BaseURL }}{{ .Params.image }}">{{ end }}
    {{ if .Params.banner }}<meta name="twitter:image" content="{{ .Site.BaseURL }}{{ .Params.banner }}">{{ end }}
    
    <link rel="stylesheet" href="/css/main.css">

    <!-- Matomo -->
    <script>
    var _paq = window._paq = window._paq || [];
    /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
    _paq.push(['trackPageView']);
    _paq.push(['enableLinkTracking']);
    (function() {
        var u="https://analytics.medlab.host/";
        _paq.push(['setTrackerUrl', u+'matomo.php']);
        _paq.push(['setSiteId', '6']);
        var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
        g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
    })();
    </script>
    <!-- End Matomo Code -->

</head>
<body>
    <header class="site-header">
        <div class="container">
            <nav>
                <a href="/" class="logo">
                    <img src="/img/yellow_e2c.png" alt="Exit to Community" />
                </a>
                <button class="mobile-menu-toggle" aria-label="Toggle mobile menu">
                    <span class="hamburger-line"></span>
                    <span class="hamburger-line"></span>
                    <span class="hamburger-line"></span>
                </button>
                <ul class="nav-links">
                    <li><a href="/case-studies/">Case Studies</a></li>
                    <li><a href="/legal-snippets/">Legal Snippets</a></li>
                    <li><a href="/resources/">Resources</a></li>
                    <li><a href="/contact/">Contact</a></li>
                </ul>
            </nav>
        </div>
    </header>

    <div class="mobile-menu-overlay"></div>

    <main>
        <div class="container">
            {{ block "main" . }}{{ end }}
        </div>
    </main>

    <footer>
        <div class="container">
            <div class="footer-content">
                <div class="footer-section">
                    <h3>Get occasional updates</h3>
                    <div class="newsletter-signup">
                        <!-- Action Network Email Subscription Form -->
                        <div id="e2c-newsletter-form">
                            <link href='https://actionnetwork.org/css/style-embed-v3.css' rel='stylesheet' type='text/css' />
                            <script src='https://actionnetwork.org/widgets/v3/form/e2c-website-newsletter-form?format=js&source=widget&clear_id=true'></script>
                            <div id='can-form-area-e2c-website-newsletter-form' style='width: 100%'></div>
                            
                            <!-- Fallback for no-JS -->
                            <noscript>
                                <form class="custom-newsletter-form" action="https://actionnetwork.org/forms/e2c-website-newsletter-form" method="post">
                                    <div class="form-group">
                                        <input type="email" name="person[email]" placeholder="Enter your email" required class="email-input">
                                        <button type="submit" class="subscribe-btn">Subscribe</button>
                                    </div>
                                </form>
                            </noscript>
                        </div>
                    </div>
                </div>
                <div class="footer-section">
                    <div class="footer-links">
                        <p>&copy; {{ now.Year }} E2C Collective<br />
                        <a href="https://opencollective.com/e2c-c">Learn more and support us &#128151;</a><br />
                        In collaboration with <a href="https://www.colorado.edu/lab/medlab/exit-to-community">MEDLab at CU Boulder</a><br />
                        This work is licensed under a Creative Commons Attribution 4.0 License</p>
                        <p><a href="/contact">Connect with us</a></p>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    
    <script src="/js/mobile-menu.js"></script>
</body>
</html>
