90 lines
3.8 KiB
Text
90 lines
3.8 KiB
Text
<main>
|
|
<section class="hero">
|
|
<div class="hero-bg"></div>
|
|
<div class="hero-orb hero-orb-1" aria-hidden="true"></div>
|
|
<div class="hero-orb hero-orb-2" aria-hidden="true"></div>
|
|
<div class="container hero-grid">
|
|
<div class="reveal" data-reveal>
|
|
<p class="eyebrow">FDA-Registered • Patented • Trusted Nationwide</p>
|
|
<h1>Automatic Bleeding Control for Real-World Emergencies</h1>
|
|
<p class="lead">AutoTQ closes the bleeding control gap with two-step operation, one-button activation, and audio guidance that helps bystanders and professionals act fast.</p>
|
|
<div class="hero-actions">
|
|
<a href="/contact" class="btn btn-primary">Request Information</a>
|
|
<a href="/about-autotq" class="btn btn-ghost">Learn About AutoTQ</a>
|
|
</div>
|
|
</div>
|
|
<div class="glass-card media-card reveal" data-reveal data-parallax="0.05">
|
|
<img src="<%= config.assets.images.hero %>" alt="AutoTQ demonstration" loading="eager" />
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section">
|
|
<div class="container split">
|
|
<div class="reveal" data-reveal>
|
|
<h2>The bleeding control gap is real</h2>
|
|
<p>In severe extremity bleeding events, people on scene need a solution they can deploy quickly and correctly. AutoTQ was built to simplify intervention at the point of injury.</p>
|
|
</div>
|
|
<div class="stats-grid reveal" data-reveal>
|
|
<article class="glass-card stat-card"><h3>92%</h3><p>First-time user success from source research pages.</p></article>
|
|
<article class="glass-card stat-card"><h3>100%</h3><p>Arterial occlusion from source research pages.</p></article>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section section-alt">
|
|
<div class="container split">
|
|
<div class="reveal" data-reveal>
|
|
<h2>Watch AutoTQ in deployment context</h2>
|
|
<p class="lead">Video source: Cape Coral Police deployment page.</p>
|
|
<p><a class="text-link" href="<%= config.videos[0].pageUrl %>" target="_blank" rel="noopener noreferrer">Open source page →</a></p>
|
|
</div>
|
|
<div class="glass-card video-frame reveal" data-reveal>
|
|
<iframe
|
|
src="<%= config.videos[0].embedUrl %>"
|
|
title="<%= config.videos[0].title %>"
|
|
loading="lazy"
|
|
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
|
allowfullscreen
|
|
></iframe>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section">
|
|
<div class="container">
|
|
<h2 class="reveal" data-reveal>Latest updates</h2>
|
|
<div class="timeline">
|
|
<% (config.news || []).forEach(item => { %>
|
|
<article class="glass-card news-card reveal" data-reveal>
|
|
<p class="date"><%= item.date %></p>
|
|
<h3><%= item.title %></h3>
|
|
<a class="text-link" href="<%= item.url %>" target="_blank" rel="noopener noreferrer">View source →</a>
|
|
</article>
|
|
<% }) %>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section section-alt">
|
|
<div class="container">
|
|
<h2 class="reveal" data-reveal>Testimonials</h2>
|
|
<div class="grid-2">
|
|
<% (config.testimonials || []).forEach(t => { %>
|
|
<article class="glass-card quote-card reveal" data-reveal>
|
|
<p>“<%= t.quote %>”</p>
|
|
<span>— <%= t.name %>, <%= t.title %></span>
|
|
</article>
|
|
<% }) %>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section">
|
|
<div class="container cta-card glass-card reveal" data-reveal>
|
|
<h2>Bring AutoTQ into your safety ecosystem</h2>
|
|
<p>Contact the team for deployment, training, literature, and partnership details.</p>
|
|
<a href="/contact" class="btn btn-primary">Contact AutoTQ</a>
|
|
</div>
|
|
</section>
|
|
</main>
|