{{template "base/head" .}}
<div role="main" aria-label="{{ctx.Locale.Tr "home"}}" class="page-content home">
	<div class="ab-hero">
		<img class="ab-hero-logo" src="{{AppSubUrl}}/assets/img/logo.svg" alt="{{AppName}}" width="96" height="96">
		<h1 class="ab-hero-title">{{AppName}}</h1>
		<p class="ab-hero-sub">La forge souveraine de l'Alliance Boréale — <em>tout est libre</em>.</p>
		<div class="ab-hero-actions">
			<a class="ui primary button" href="{{AppSubUrl}}/explore/repos">Explorer les dépôts</a>
			{{if not .IsSigned}}<a class="ui button" href="{{AppSubUrl}}/user/login">Se connecter</a>{{end}}
		</div>
	</div>
</div>
<style>
.home .ab-hero { max-width: 720px; margin: 8vh auto; text-align: center; padding: 2.4rem 2rem;
	background:
		radial-gradient(600px 300px at 70% -10%, rgba(19,26,68,.7) 0%, transparent 60%),
		radial-gradient(500px 260px at 20% 0%, rgba(14,22,64,.6) 0%, transparent 55%),
		linear-gradient(180deg, rgba(10,13,36,.5) 0%, transparent 70%);
	border: 1px solid rgba(255,255,255,.08); border-radius: 18px; }
.home .ab-hero-logo { filter: drop-shadow(0 0 22px rgba(86,194,255,.5)); }
.home .ab-hero-title { font-size: 2.4rem; margin: .7rem 0 .2rem; letter-spacing: .5px; }
.home .ab-hero-sub { color: var(--color-text-light); font-size: 1.12rem; margin-bottom: 1.7rem; }
.home .ab-hero-actions { display: flex; gap: .8rem; justify-content: center; flex-wrap: wrap; }
</style>
{{template "base/footer" .}}