<div id="unlock-card" class="q-unlock">
{% if unlock.sent %}
<h3>Check your email</h3>
<p class="muted">We sent a link to <b>{{ unlock.email }}</b>. It works once and expires in 15 minutes. Opening it shows the full report and starts monitoring.</p>
{% else %}
<h3>Get the full report</h3>
<ul class="q-perks">
<li>Every URL behind every issue</li>
<li>A 500-page crawl of the whole site</li>
<li>Weekly monitoring, with an email when something important breaks</li>
</ul>
<form method="post" action="/audit/{{ unlock.id }}/unlock" hx-post="/audit/{{ unlock.id }}/unlock" hx-target="#unlock-card" hx-swap="outerHTML" hx-disabled-elt="find button">
<input class="input input-lg" name="email" type="email" value="{{ unlock.email }}" placeholder="you@company.com" autocomplete="email" aria-label="Your email" required>
<button class="btn btn-primary btn-lg" type="submit">Email me the full report<span class="spinner"></span></button>
</form>
{% if let Some(err) = unlock.error %}<p class="error-text" role="alert"><svg class="icon" style="width:14px;height:14px"><use href="#i-alert"/></svg>{{ err }}</p>{% endif %}
<p class="l-hint">Free plan: 1 site, weekly crawls, email alerts. No card needed.</p>
{% endif %}
</div>