Menu
Public repository / 7c20bfc03c11ad45182bbadd48707716a287085a
AkurAI-Platform / frontend/index.html
Latest change 7d5583b2d567dad90a09401a978ae2167556f018 - Add Knowledge category section to template + en.json locale strings + Notes icon by Olafur Bui
{% include "header" %}
<main>
<section class="hero">
<div class="hero-glow" aria-hidden="true"></div>
<div class="shell hero-grid">
<div class="hero-copy">
<span class="eyebrow">{{ t "hero.eyebrow" }}</span>
<h1>{{ t "hero.headline" }} <span class="grad">{{ t "hero.headline_accent" }}</span></h1>
<p class="lede">{{ t "hero.lede" }}</p>
<div class="btn-row">
<a class="btn btn-primary" href="#suite">{{ t "hero.cta_primary" }}</a>
<a class="btn btn-secondary" href="{{ github.url }}">{{ t "hero.cta_secondary" }}</a>
</div>
<div id="health" class="health-pill" aria-live="polite">{{ t "hero.checking" }}</div>
<div class="hero-proof" aria-label='{{ t "hero.proof_label" }}'>
<span><strong>{{ t "trust.value1" }}</strong>{{ t "hero.proof_apps" }}</span>
<span><strong>{{ t "trust.value2" }}</strong>{{ t "hero.proof_memory" }}</span>
<span><strong>{{ t "trust.value4" }}</strong>{{ t "hero.proof_deps" }}</span>
</div>
</div>
<div class="hero-art">
<div class="control-panel" data-control-panel aria-label='{{ t "control.aria" }}'>
<div class="control-panel-head">
<div>
<span class="panel-kicker">{{ t "control.kicker" }}</span>
<strong>{{ t "control.title" }}</strong>
</div>
<span class="panel-live" data-platform-state>{{ t "control.syncing" }}</span>
</div>
<div class="control-map" data-control-map>
<svg class="control-lines" viewBox="0 0 560 360" aria-hidden="true">
<path class="route route-a" d="M280 178 C210 86 118 82 88 126" />
<path class="route route-b" d="M280 178 C348 72 446 82 472 128" />
<path class="route route-c" d="M280 178 C178 176 114 210 86 266" />
<path class="route route-d" d="M280 178 C382 176 446 210 474 266" />
<path class="route route-e" d="M280 178 C250 250 202 286 158 306" />
<path class="route route-f" d="M280 178 C310 250 358 286 402 306" />
<path class="route route-g" d="M280 178 C256 118 230 86 202 64" />
<path class="route route-h" d="M280 178 C304 118 330 86 358 64" />
</svg>
<div class="control-core">
<span>{{ t "control.core_label" }}</span>
<strong>{{ t "control.core_title" }}</strong>
<small>platform.olibuijr.com</small>
</div>
<button class="control-node node-mail is-active" data-service="mail" type="button">
<span class="node-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='5' width='18' height='14' rx='2'/><path d='m3 7 9 6 9-6'/></svg></span>
<span>{{ t "app.mail.name" }}</span>
</button>
<button class="control-node node-auth" data-service="auth" type="button">
<span class="node-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3 5 6v5c0 4 3 7 7 9 4-2 7-5 7-9V6z'/><circle cx='12' cy='11' r='1.7'/><path d='M12 12.6V15'/></svg></span>
<span>{{ t "app.auth.name" }}</span>
</button>
<button class="control-node node-vpn" data-service="vpn" type="button">
<span class="node-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='8.5'/><path d='M3.5 12h17'/><path d='M12 3.5c2.6 2.4 2.6 14.6 0 17'/><path d='M12 3.5c-2.6 2.4-2.6 14.6 0 17'/></svg></span>
<span>{{ t "app.vpn.name" }}</span>
</button>
<button class="control-node node-drive" data-service="drive" type="button">
<span class="node-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><path d='M7 18h9a4 4 0 0 0 .5-7.97 5.5 5.5 0 0 0-10.6-1.2A3.75 3.75 0 0 0 7 18Z'/><path d='M12 9.5v5'/><path d='m9.8 11.7 2.2-2.2 2.2 2.2'/></svg></span>
<span>{{ t "app.drive.name" }}</span>
</button>
<button class="control-node node-router" data-service="router" type="button">
<span class="node-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='2.2'/><circle cx='5' cy='6' r='1.6'/><circle cx='19' cy='6' r='1.6'/><circle cx='5' cy='18' r='1.6'/><circle cx='19' cy='18' r='1.6'/><path d='M10.3 10.6 6.4 7.2M13.7 10.6 17.6 7.2M10.3 13.4 6.4 16.8M13.7 13.4 17.6 16.8'/></svg></span>
<span>{{ t "app.router.name" }}</span>
</button>
<button class="control-node node-monitor" data-service="monitor" type="button">
<span class="node-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='4' width='18' height='13' rx='2'/><path d='M3 13h4l1.6-3.2 2 5 1.4-2.8H21'/><path d='M9 21h6M12 17v4'/></svg></span>
<span>{{ t "app.monitor.name" }}</span>
</button>
<button class="control-node node-dns" data-service="dns" type="button">
<span class="node-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><path d='M12 3v18'/><path d='M6 6h10l2 2-2 2H6z'/><path d='M18 13H8l-2 2 2 2h10z'/></svg></span>
<span>{{ t "app.dns.name" }}</span>
</button>
<button class="control-node node-framework" data-service="framework" type="button">
<span class="node-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'><path d='m12 3 8 4.5-8 4.5-8-4.5z'/><path d='m4 12 8 4.5 8-4.5'/><path d='m4 16.5 8 4.5 8-4.5'/></svg></span>
<span>{{ t "app.framework.name" }}</span>
</button>
</div>
<div class="control-readout">
<span><strong>{{ t "control.readout_owner" }}</strong>{{ t "control.readout_owner_label" }}</span>
<span><strong>{{ t "control.readout_route" }}</strong>{{ t "control.readout_route_label" }}</span>
<span><strong>{{ t "control.readout_runtime" }}</strong>{{ t "control.readout_runtime_label" }}</span>
</div>
</div>
</div>
</div>
</section>
<section id="motion" class="motion-section section">
<div class="shell motion-grid">
<div class="motion-copy">
<span class="eyebrow">{{ t "motion.eyebrow" }}</span>
<h2>{{ t "motion.heading" }}</h2>
<p>{{ t "motion.lede" }}</p>
<div class="motion-points" aria-label='{{ t "motion.points_label" }}'>
<span>{{ t "motion.point1" }}</span>
<span>{{ t "motion.point2" }}</span>
<span>{{ t "motion.point3" }}</span>
</div>
</div>
<div class="motion-stage">
<video class="motion-video" src="/assets/akurai-platform-infographic.mp4" autoplay muted loop playsinline preload="metadata" aria-label='{{ t "motion.video_label" }}'></video>
</div>
</div>
</section>
<section id="suite" class="shell section">
<div class="section-head">
<span class="eyebrow">{{ t "suite.eyebrow" }}</span>
<h2>{{ t "suite.title" }}</h2>
<p>{{ t "suite.lede" }}</p>
</div>
<div class="suite">
<!-- Category 1: Communication -->
<section class="cat">
<header class="cat-head">
<span class="cat-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M21 12a8 8 0 0 1-11.5 7.2L4 20l1-4.2A8 8 0 1 1 21 12Z'/></svg></span>
<div>
<h3>{{ t "category.communication" }}</h3>
<p>{{ t "category.communication.tagline" }}</p>
</div>
</header>
<div class="cat-grid">
<article class="tile">
<span class="tile-icon"><img src="/img/icons/mail.svg" alt="" width="48" height="48" loading="lazy"></span>
<div class="tile-body">
<div class="tile-top">
<h4>{{ t "app.mail.name" }}</h4>
<span class="tile-kind">{{ t "app.mail.kind" }}</span>
</div>
<p class="tile-prop">{{ t "app.mail.valueprop" }}</p>
</div>
<div class="tile-foot">
<a class="tile-open" href="https://mail.olibuijr.com">{{ t "app.action.open" }}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 17 17 7M9 7h8v8"/></svg></a>
<a class="tile-src" href="https://github.com/olibuijr/AkurAIMail">AkurAIMail</a>
<a class="tile-src" href="https://github.com/olibuijr/akurai-mail-api">akurai-mail-api</a>
</div>
</article>
</div>
</section>
<!-- Category 2: Security & privacy -->
<section class="cat">
<header class="cat-head">
<span class="cat-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><rect x='5' y='11' width='14' height='9' rx='2'/><path d='M8 11V8a4 4 0 0 1 8 0v3'/></svg></span>
<div>
<h3>{{ t "category.security" }}</h3>
<p>{{ t "category.security.tagline" }}</p>
</div>
</header>
<div class="cat-grid">
<article class="tile">
<span class="tile-icon"><img src="/img/icons/auth.svg" alt="" width="48" height="48" loading="lazy"></span>
<div class="tile-body">
<div class="tile-top">
<h4>{{ t "app.auth.name" }}</h4>
<span class="tile-kind">{{ t "app.auth.kind" }}</span>
</div>
<p class="tile-prop">{{ t "app.auth.valueprop" }}</p>
</div>
<div class="tile-foot">
<a class="tile-open" href="https://auth.olibuijr.com">{{ t "app.action.open" }}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 17 17 7M9 7h8v8"/></svg></a>
<a class="tile-src" href="https://github.com/olibuijr/akurai-idp">akurai-idp</a>
</div>
</article>
<article class="tile">
<span class="tile-icon"><img src="/img/icons/vpn.svg" alt="" width="48" height="48" loading="lazy"></span>
<div class="tile-body">
<div class="tile-top">
<h4>{{ t "app.vpn.name" }}</h4>
<span class="tile-kind">{{ t "app.vpn.kind" }}</span>
</div>
<p class="tile-prop">{{ t "app.vpn.valueprop" }}</p>
</div>
<div class="tile-foot">
<a class="tile-open" href="https://akurai-vpn.olibuijr.com">{{ t "app.action.open" }}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 17 17 7M9 7h8v8"/></svg></a>
<a class="tile-src" href="https://github.com/olibuijr/AkurAI-VPN">AkurAI-VPN</a>
</div>
</article>
</div>
</section>
<!-- Category 3: Storage -->
<section class="cat">
<header class="cat-head">
<span class="cat-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M7 18h9a4 4 0 0 0 .5-7.97 5.5 5.5 0 0 0-10.6-1.2A3.75 3.75 0 0 0 7 18Z'/></svg></span>
<div>
<h3>{{ t "category.storage" }}</h3>
<p>{{ t "category.storage.tagline" }}</p>
</div>
</header>
<div class="cat-grid">
<article class="tile">
<span class="tile-icon"><img src="/img/icons/drive.svg" alt="" width="48" height="48" loading="lazy"></span>
<div class="tile-body">
<div class="tile-top">
<h4>{{ t "app.drive.name" }}</h4>
<span class="tile-kind">{{ t "app.drive.kind" }}</span>
</div>
<p class="tile-prop">{{ t "app.drive.valueprop" }}</p>
</div>
<div class="tile-foot">
<a class="tile-open" href="https://akurai-drive.olibuijr.com">{{ t "app.action.open" }}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 17 17 7M9 7h8v8"/></svg></a>
</div>
</article>
</div>
</section>
<!-- Category 4: Knowledge -->
<section class="cat">
<header class="cat-head">
<span class="cat-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M4 4.5A1.5 1.5 0 0 1 5.5 3H17l2.5 2.5V20.5A1.5 1.5 0 0 1 18 22H5.5A1.5 1.5 0 0 1 4 20.5z'/><path d='M8 7h8M8 11h8M8 15h5'/><circle cx='18.5' cy='17.5' r='3.5'/><path d='m21 20-1.5-1.5'/></svg></span>
<div>
<h3>{{ t "category.knowledge" }}</h3>
<p>{{ t "category.knowledge.tagline" }}</p>
</div>
</header>
<div class="cat-grid">
<article class="tile">
<span class="tile-icon"><img src="/img/icons/notes.svg" alt="" width="48" height="48" loading="lazy"></span>
<div class="tile-body">
<div class="tile-top">
<h4>{{ t "app.notes.name" }}</h4>
<span class="tile-kind">{{ t "app.notes.kind" }}</span>
</div>
<p class="tile-prop">{{ t "app.notes.valueprop" }}</p>
</div>
<div class="tile-foot">
<a class="tile-open" href="https://akurai-notes.olibuijr.com">{{ t "app.action.open" }}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 17 17 7M9 7h8v8"/></svg></a>
<a class="tile-src" href="https://github.com/olibuijr/AkurAI-Notes">AkurAI-Notes</a>
</div>
</article>
</div>
</section>
<!-- Category 5: Business -->
<section class="cat">
<header class="cat-head">
<span class="cat-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='7' width='18' height='13' rx='2'/><path d='M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/><path d='M3 12h18'/></svg></span>
<div>
<h3>{{ t "category.business" }}</h3>
<p>{{ t "category.business.tagline" }}</p>
</div>
</header>
<div class="cat-grid">
<article class="tile">
<span class="tile-icon"><img src="/img/icons/crm.svg" alt="" width="48" height="48" loading="lazy"></span>
<div class="tile-body">
<div class="tile-top">
<h4>{{ t "app.crm.name" }}</h4>
<span class="tile-kind">{{ t "app.crm.kind" }}</span>
</div>
<p class="tile-prop">{{ t "app.crm.valueprop" }}</p>
</div>
<div class="tile-foot">
<span class="tile-flag">{{ t "app.action.dev" }}</span>
<a class="tile-src" href="https://github.com/olibuijr/akurai-crm">akurai-crm</a>
</div>
</article>
</div>
</section>
<!-- Category 5: Infrastructure -->
<section class="cat">
<header class="cat-head">
<span class="cat-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='4' width='18' height='7' rx='1.5'/><rect x='3' y='13' width='18' height='7' rx='1.5'/><path d='M7 7.5h.01M7 16.5h.01'/></svg></span>
<div>
<h3>{{ t "category.infrastructure" }}</h3>
<p>{{ t "category.infrastructure.tagline" }}</p>
</div>
</header>
<div class="cat-grid">
<article class="tile">
<span class="tile-icon"><img src="/img/icons/router.svg" alt="" width="48" height="48" loading="lazy"></span>
<div class="tile-body">
<div class="tile-top">
<h4>{{ t "app.router.name" }}</h4>
<span class="tile-kind">{{ t "app.router.kind" }}</span>
</div>
<p class="tile-prop">{{ t "app.router.valueprop" }}</p>
</div>
<div class="tile-foot">
<a class="tile-open" href="https://akurai-router.olibuijr.com/health">{{ t "app.action.status" }}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 17 17 7M9 7h8v8"/></svg></a>
<a class="tile-src" href="https://github.com/olibuijr/AkurAI-Router">AkurAI-Router</a>
</div>
</article>
<article class="tile">
<span class="tile-icon"><img src="/img/icons/monitor.svg" alt="" width="48" height="48" loading="lazy"></span>
<div class="tile-body">
<div class="tile-top">
<h4>{{ t "app.monitor.name" }}</h4>
<span class="tile-kind">{{ t "app.monitor.kind" }}</span>
</div>
<p class="tile-prop">{{ t "app.monitor.valueprop" }}</p>
</div>
<div class="tile-foot">
<a class="tile-open" href="https://monitor.olibuijr.com">{{ t "app.action.open" }}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 17 17 7M9 7h8v8"/></svg></a>
<a class="tile-src" href="https://github.com/olibuijr/rust-monitor">rust-monitor</a>
</div>
</article>
<article class="tile">
<span class="tile-icon"><img src="/img/icons/dns.svg" alt="" width="48" height="48" loading="lazy"></span>
<div class="tile-body">
<div class="tile-top">
<h4>{{ t "app.dns.name" }}</h4>
<span class="tile-kind">{{ t "app.dns.kind" }}</span>
</div>
<p class="tile-prop">{{ t "app.dns.valueprop" }}</p>
</div>
<div class="tile-foot">
<span class="tile-flag">{{ t "app.action.dns" }}</span>
<a class="tile-src" href="https://github.com/olibuijr/akurai-dns">akurai-dns</a>
</div>
</article>
</div>
</section>
<!-- Category 6: Developer -->
<section class="cat">
<header class="cat-head">
<span class="cat-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='m9 8-4 4 4 4'/><path d='m15 8 4 4-4 4'/></svg></span>
<div>
<h3>{{ t "category.developer" }}</h3>
<p>{{ t "category.developer.tagline" }}</p>
</div>
</header>
<div class="cat-grid">
<article class="tile">
<span class="tile-icon"><img src="/img/icons/framework.svg" alt="" width="48" height="48" loading="lazy"></span>
<div class="tile-body">
<div class="tile-top">
<h4>{{ t "app.framework.name" }}</h4>
<span class="tile-kind">{{ t "app.framework.kind" }}</span>
</div>
<p class="tile-prop">{{ t "app.framework.valueprop" }}</p>
</div>
<div class="tile-foot">
<a class="tile-open" href="https://akurai-framework.olibuijr.com">{{ t "app.action.open" }}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 17 17 7M9 7h8v8"/></svg></a>
<a class="tile-src" href="https://github.com/olibuijr/AkurAI-Framework">AkurAI-Framework</a>
</div>
</article>
<article class="tile">
<span class="tile-icon"><img src="/img/icons/platform.svg" alt="" width="48" height="48" loading="lazy"></span>
<div class="tile-body">
<div class="tile-top">
<h4>{{ t "app.platform.name" }}</h4>
<span class="tile-kind">{{ t "app.platform.kind" }}</span>
</div>
<p class="tile-prop">{{ t "app.platform.valueprop" }}</p>
</div>
<div class="tile-foot">
<a class="tile-open" href="https://platform.olibuijr.com">{{ t "app.action.open" }}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 17 17 7M9 7h8v8"/></svg></a>
<a class="tile-src" href="https://github.com/olibuijr/AkurAI-Platform">AkurAI-Platform</a>
</div>
</article>
<article class="tile">
<span class="tile-icon"><img src="/img/icons/akurai.svg" alt="" width="48" height="48" loading="lazy"></span>
<div class="tile-body">
<div class="tile-top">
<h4>{{ t "app.gateway.name" }}</h4>
<span class="tile-kind">{{ t "app.gateway.kind" }}</span>
</div>
<p class="tile-prop">{{ t "app.gateway.valueprop" }}</p>
</div>
<div class="tile-foot">
<a class="tile-open" href="http://mail.olibuijr.com:8644/health">{{ t "app.action.status" }}<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 17 17 7M9 7h8v8"/></svg></a>
<a class="tile-src" href="https://github.com/olibuijr/AkurAI-RustAgent">AkurAI-RustAgent</a>
</div>
</article>
</div>
</section>
</div>
</section>
<section id="why" class="shell section">
<div class="section-head">
<span class="eyebrow">{{ t "why.eyebrow" }}</span>
<h2>{{ t "why.heading" }}</h2>
<p>{{ t "why.lede" }}</p>
</div>
<div class="features">
<article class="feature">
<span class="feature-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M4 11 12 4l8 7'/><path d='M6 10v9h12v-9'/><rect x='10' y='13' width='4' height='6' rx='1'/></svg></span>
<h3>{{ t "why.feature1.title" }}</h3>
<p>{{ t "why.feature1.body" }}</p>
</article>
<article class="feature">
<span class="feature-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M20 4C13 4 8 9 6 16l-2 4 4-2c7-2 12-7 12-14Z'/><path d='M9 17 18 8'/><path d='M14 7h.01'/></svg></span>
<h3>{{ t "why.feature2.title" }}</h3>
<p>{{ t "why.feature2.body" }}</p>
</article>
<article class="feature">
<span class="feature-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='3.2'/><path d='M12 3v2.5M12 18.5V21M3 12h2.5M18.5 12H21M5.6 5.6l1.8 1.8M16.6 16.6l1.8 1.8M18.4 5.6l-1.8 1.8M7.4 16.6l-1.8 1.8'/></svg></span>
<h3>{{ t "why.feature3.title" }}</h3>
<p>{{ t "why.feature3.body" }}</p>
</article>
<article class="feature">
<span class="feature-icon"><svg viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M3 19h18'/><path d='m6 19 5-9 3 4 2-3 4 8'/></svg></span>
<h3>{{ t "why.feature4.title" }}</h3>
<p>{{ t "why.feature4.body" }}</p>
</article>
</div>
</section>
<section class="shell section proof">
<div class="section-head">
<span class="eyebrow">{{ t "proof.eyebrow" }}</span>
<h2>{{ t "proof.heading" }}</h2>
<p>{{ t "proof.lede" }}</p>
</div>
<div class="proof-grid">
<!-- Card 1: Auth -->
<article class="proof-card">
<p class="proof-task">{{ t "proof.card1.name" }}</p>
<p class="proof-big">{{ proof.card1.akur_memory }}</p>
<p class="proof-sub">{{ t "proof.card1.akur_label" }}</p>
<div class="proof-vs">
<span>{{ t "methodology.vs" }} {{ proof.card1.other_memory }}</span>
<span class="proof-other">{{ t "proof.card1.other_product" }}</span>
</div>
<p class="proof-diff">{{ t "proof.card1.difference" }}</p>
<a class="proof-src" href="{{ proof.card1.source_url }}">{{ t "proof.card1.source_label" }}</a>
</article>
<!-- Card 2: Monitor -->
<article class="proof-card">
<p class="proof-task">{{ t "proof.card2.name" }}</p>
<p class="proof-big">{{ proof.card2.akur_memory }}</p>
<p class="proof-sub">{{ t "proof.card2.akur_label" }}</p>
<div class="proof-vs">
<span>{{ t "methodology.vs" }} {{ proof.card2.other_memory }}</span>
<span class="proof-other">{{ t "proof.card2.other_product" }}</span>
</div>
<p class="proof-diff">{{ t "proof.card2.difference" }}</p>
<a class="proof-src" href="{{ proof.card2.source_url }}">{{ t "proof.card2.source_label" }}</a>
</article>
<!-- Card 3: DNS -->
<article class="proof-card">
<p class="proof-task">{{ t "proof.card3.name" }}</p>
<p class="proof-big">{{ proof.card3.akur_memory }}</p>
<p class="proof-sub">{{ t "proof.card3.akur_label" }}</p>
<div class="proof-vs">
<span>{{ t "methodology.vs" }} {{ proof.card3.other_memory }}</span>
<span class="proof-other">{{ t "proof.card3.other_product" }}</span>
</div>
<p class="proof-diff">{{ t "proof.card3.difference" }}</p>
<a class="proof-src" href="{{ proof.card3.source_url }}">{{ t "proof.card3.source_label" }}</a>
</article>
<!-- Card 4: Serve Page -->
<article class="proof-card">
<p class="proof-task">{{ t "proof.card4.name" }}</p>
<p class="proof-big">{{ proof.card4.akur_memory }}</p>
<p class="proof-sub">{{ t "proof.card4.akur_label" }}</p>
<div class="proof-vs">
<span>{{ t "methodology.vs" }} {{ proof.card4.other_memory }}</span>
<span class="proof-other">{{ t "proof.card4.other_product" }}</span>
</div>
<p class="proof-diff">{{ t "proof.card4.difference" }}</p>
<a class="proof-src" href="{{ proof.card4.source_url }}">{{ t "proof.card4.source_label" }}</a>
</article>
</div>
</section>
<section class="trust-band">
<div class="shell trust">
<div class="trust-cell">
<strong>{{ t "trust.value1" }}</strong>
<span>{{ t "trust.label1" }}</span>
</div>
<div class="trust-cell">
<strong>{{ t "trust.value2" }}</strong>
<span>{{ t "trust.label2" }}</span>
</div>
<div class="trust-cell">
<strong>{{ t "trust.value3" }}</strong>
<span>{{ t "trust.label3" }}</span>
</div>
<div class="trust-cell">
<strong>{{ t "trust.value4" }}</strong>
<span>{{ t "trust.label4" }}</span>
</div>
</div>
</section>
<section id="cta" class="shell section cta">
<span class="eyebrow">{{ t "cta.eyebrow" }}</span>
<h2>{{ t "cta.heading" }}</h2>
<p>{{ t "cta.lede" }}</p>
<div class="btn-row center">
<a class="btn btn-primary" href="#suite">{{ t "cta.primary" }}</a>
<a class="btn btn-secondary" href="{{ github.url }}">{{ t "cta.secondary" }}</a>
</div>
</section>
<section id="sources" class="shell section sources-section">
<div>
<span class="eyebrow">{{ t "methodology.label" }}</span>
<h2>{{ t "methodology.title" }}</h2>
<p>{{ t "methodology.text" }}</p>
</div>
<div class="source-list">
{% for source in sources %}
<a href="{{ source.url }}">{{ source.label }}</a>
{% endfor %}
</div>
</section>
</main>
{% include "footer" %}