<!DOCTYPE html>
<html lang="{{@site.lang}}">
  <head>
    {{!-- Document Settings --}}
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

    {{!-- Base Meta --}}
    <title>{{meta_title}}</title>
    <meta name="HandheldFriendly" content="True" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    {{!-- Styles'n'Scripts --}}
    <style>
      /* This font-face is here to make icons work if the Ghost instance is installed in a subdirectory */
      @font-face {
        font-family: 'icomoon';
        src: url("{{asset 'fonts/icomoon.eot?vukg2s'}}");
        src: url("{{asset 'fonts/icomoon.eot?vukg2s#iefix'}}") format('embedded-opentype'),
        url("{{asset 'fonts/icomoon.ttf?vukg2s'}}") format('truetype'),
        url("{{asset 'fonts/icomoon.woff?vukg2s'}}") format('woff'),
        url("{{asset 'fonts/icomoon.svg?vukg2s#icomoon'}}") format('svg');
        font-weight: normal;
        font-style: normal;
        font-display: swap;
      }
    </style>
    <link rel="stylesheet" type="text/css" href="{{asset "css/app.css"}}" media="screen" />

    {{!-- This #block helper will pull data from the hero partial 
    to inject styles of the hero image to make it responsive --}}
    {{{block "herobackground"}}}

    {{!-- This tag outputs SEO meta+structured data and other important settings --}}
    {{ghost_head}}

    {{!-- This variable is used to make the search form work --}}
    <script>
      // @license magnet:?xt=urn:btih:d3d9a9a6595521f9666a5e94cc830dab83b65699&dn=expat.txt Expat
      const ghostHost = "{{@site.url}}"
      // @license-end
    </script>

    {{!-- This script loads the Google font asynchronously --}}
    <script>
      // @license magnet:?xt=urn:btih:d3d9a9a6595521f9666a5e94cc830dab83b65699&dn=expat.txt Expat
      WebFontConfig = {
        google: { families: ['Source+Sans+Pro:400,600,700&display=swap'] }
      };

      (function (d) {
        var wf = d.createElement('script'), s = d.scripts[0];
        wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js';
        wf.async = true;
        s.parentNode.insertBefore(wf, s);
      })(document);
      // @license-end
    </script>
  </head>
  <body class="{{body_class}}">
    {{!-- All the main content gets inserted here, index.hbs, post.hbs, etc --}}
    {{{body}}}

    {{!-- Search form --}}
    {{> search}}

    {{!-- The footer --}}
    {{> footer}}

    {{!-- Notifications alerts --}}
    {{> "notifications"}}

    {{!-- Common scripts shared between pages --}}
    <script crossorigin="anonymous" src="https://polyfill.io/v3/polyfill.min.js?features=IntersectionObserver%2CPromise%2CArray.prototype.includes%2CString.prototype.endsWith%2CString.prototype.startsWith%2CObject.assign%2CNodeList.prototype.forEach"></script>
    <script defer src="{{asset "js/vendor/content-api.min.js"}}"></script>
    <script defer src="{{asset "js/manifest.js"}}"></script>
    <script defer src="{{asset "js/vendor.js"}}"></script>
    <script defer src="{{asset "js/app.js"}}"></script>

    {{!-- The #block helper will pull in data from the #contentFor other template files --}}
    {{{block "scripts"}}}

    {{!-- Ghost outputs important scripts and data with this tag --}}
    {{ghost_foot}}
  </body>
</html>
