feat(home): build complete homepage and global templates

Scaffolds all components needed for the home and ships a working
front-page implementation covering the 9-section wireframe.

Components (assets/css/components.css)
- 13 sections per Design Handoff section 3:
  buttons, links, forms, cards (5 variants), stat callouts, header,
  nav, mega menu, drawer, footer, hero, logo strip, eyebrow,
  section title/lead, conversion banner, scroll reveal.
- All token-driven, prefixed `av-`, BEM-light. Mobile-first with
  768/1024/1280 breakpoints. Respects prefers-reduced-motion.

Global templates
- header.php: sticky header (60px mobile / 72px desktop), 5-item
  nav, language switcher, primary CTA, mobile drawer with hamburger
  toggle. Skip link first focusable element.
- footer.php: 5-column dark footer (Solutions, Industries, Why
  Asterion, Why Asterion, Newsletter), bottom strip with legal
  links + social.
- index.php: archive/search/blog fallback rendering posts in
  card-blog layout.
- front-page.php: full home with 9 sections, EN copy lifted
  verbatim from PDF Strategie D.1:
    1. Hero "Your Last Mistake Should Be in VR." + 2 CTAs
    2. Trust bar (placeholder logos + 4 inline metrics)
    3. Solutions: MY / FLEX / ACADEMY (3 cards)
    4. Industries: Police / SF / Military / Firefighters (2x2)
    5. Feature heroes: UWeD, Instructor Cockpit, AAR (alternating)
    6. Featured case study with 3 stat callouts
    7. Testimonials (3 quote cards)
    8. Latest insights (queries `post`; placeholder when empty)
    9. Conversion banner (Demo / T&E / Quote)

Verified: HTTP 200 on http://localhost:10004/, 73 KB HTML, 418 ms.

Outstanding (deferred)
- Hero video master + photographs (see MISSING-ASSETS.md)
- Mega menu content (links currently flat to section index)
- Form posts (newsletter currently no-op POST)
- Bricks license activation (manual, requires user key)
- WPML setup wizard (manual, requires user key)
- Lighthouse + axe full audit (visual env required)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-05-09 12:08:43 +02:00
parent 6f62082dc4
commit 773f137eb7
5 changed files with 1462 additions and 97 deletions

View File

@@ -0,0 +1,96 @@
<?php
/**
* Asterion Bricks — Global footer
*
* Per Design Handoff section 3.5 :
* - 5 columns desktop : Solutions / Industries / Why Asterion / Resources / Newsletter
* - Stack on mobile (could become accordions later)
* - Bottom strip : copyright · privacy · terms · cookies · social · language switcher
*
* @package AsterionBricks
*/
defined('ABSPATH') || exit;
$av_year = date_i18n('Y');
?>
</main><!-- /#main -->
<footer class="av-footer" role="contentinfo">
<div class="av-container">
<div class="av-footer__cols">
<div class="av-footer__brand">
<a href="<?php echo esc_url(home_url('/')); ?>" class="av-header__logo" aria-label="Asterion VR — home">
ASTERION&nbsp;VR
</a>
<p>
<?php esc_html_e('The modular, sovereign XR platform for European security forces. Train like the threat is now.', 'asterion-bricks'); ?>
</p>
</div>
<div class="av-footer__col">
<h2 class="av-footer__col-title"><?php esc_html_e('Solutions', 'asterion-bricks'); ?></h2>
<ul class="av-footer__list">
<li><a href="<?php echo esc_url(home_url('/solutions/my-proserve/')); ?>">MY PROSERVE</a></li>
<li><a href="<?php echo esc_url(home_url('/solutions/proserve-flex/')); ?>">PROSERVE FLEX</a></li>
<li><a href="<?php echo esc_url(home_url('/solutions/proserve-academy/')); ?>">PROSERVE ACADEMY</a></li>
<li><a href="<?php echo esc_url(home_url('/solutions/customization/')); ?>">PROSERVE+</a></li>
</ul>
</div>
<div class="av-footer__col">
<h2 class="av-footer__col-title"><?php esc_html_e('Industries', 'asterion-bricks'); ?></h2>
<ul class="av-footer__list">
<li><a href="<?php echo esc_url(home_url('/industries/police/')); ?>"><?php esc_html_e('Police', 'asterion-bricks'); ?></a></li>
<li><a href="<?php echo esc_url(home_url('/industries/special-forces/')); ?>"><?php esc_html_e('Special Forces', 'asterion-bricks'); ?></a></li>
<li><a href="<?php echo esc_url(home_url('/industries/military/')); ?>"><?php esc_html_e('Military', 'asterion-bricks'); ?></a></li>
<li><a href="<?php echo esc_url(home_url('/industries/firefighters/')); ?>"><?php esc_html_e('Firefighters', 'asterion-bricks'); ?></a></li>
</ul>
</div>
<div class="av-footer__col">
<h2 class="av-footer__col-title"><?php esc_html_e('Why Asterion', 'asterion-bricks'); ?></h2>
<ul class="av-footer__list">
<li><a href="<?php echo esc_url(home_url('/about/')); ?>"><?php esc_html_e('Our story', 'asterion-bricks'); ?></a></li>
<li><a href="<?php echo esc_url(home_url('/customers/')); ?>"><?php esc_html_e('Customers', 'asterion-bricks'); ?></a></li>
<li><a href="<?php echo esc_url(home_url('/trust/')); ?>"><?php esc_html_e('Trust & Compliance', 'asterion-bricks'); ?></a></li>
<li><a href="<?php echo esc_url(home_url('/partners/')); ?>"><?php esc_html_e('Partners', 'asterion-bricks'); ?></a></li>
</ul>
</div>
<div class="av-footer__newsletter">
<h2 class="av-footer__col-title"><?php esc_html_e('Newsletter', 'asterion-bricks'); ?></h2>
<p style="color:var(--color-text-on-dark-muted);font-size:var(--text-body-sm);">
<?php esc_html_e('Insights from the front of immersive training. One email per month. No spam.', 'asterion-bricks'); ?>
</p>
<form class="av-footer__newsletter-form" method="post" action="#" aria-label="<?php esc_attr_e('Newsletter signup', 'asterion-bricks'); ?>">
<label for="av-newsletter-email" class="av-sr-only"><?php esc_html_e('Your email', 'asterion-bricks'); ?></label>
<input type="email" id="av-newsletter-email" name="email" class="av-input" placeholder="<?php esc_attr_e('your@email.com', 'asterion-bricks'); ?>" required>
<button type="submit" class="av-btn av-btn--primary av-btn--md"><?php esc_html_e('Subscribe', 'asterion-bricks'); ?></button>
</form>
</div>
</div>
<div class="av-footer__bottom">
<div>© <?php echo esc_html($av_year); ?> Asterion VR. <?php esc_html_e('All rights reserved.', 'asterion-bricks'); ?></div>
<div class="av-footer__bottom-links">
<a href="<?php echo esc_url(home_url('/legal/privacy/')); ?>"><?php esc_html_e('Privacy', 'asterion-bricks'); ?></a>
<a href="<?php echo esc_url(home_url('/legal/terms/')); ?>"><?php esc_html_e('Terms', 'asterion-bricks'); ?></a>
<a href="<?php echo esc_url(home_url('/legal/cookies/')); ?>"><?php esc_html_e('Cookies', 'asterion-bricks'); ?></a>
<a href="<?php echo esc_url(home_url('/legal/notice/')); ?>"><?php esc_html_e('Legal notice', 'asterion-bricks'); ?></a>
</div>
<div class="av-footer__social">
<a href="https://www.linkedin.com/company/asterion-vr/" rel="noopener" aria-label="LinkedIn">LinkedIn</a>
·
<a href="https://www.youtube.com/" rel="noopener" aria-label="YouTube">YouTube</a>
</div>
</div>
</div>
</footer>
<?php wp_footer(); ?>
</body>
</html>