feat(solutions): build 5-page Solutions section

Implements the 5 Solutions pages (1 hub + 4 tier detail) with full EN copy
from PDF Strategie & Contenu D.2-D.6.

Architecture
- inc/solutions-data.php: single PHP array keyed by slug, holds the 4 tiers
  (my-proserve, proserve-flex, proserve-academy, customization). Each tier
  declares its hero, sections, and optional upsell. Section schema supports
  4 types: prose / cards / list / cta.
- template-parts/solution-detail.php: reusable partial that iterates the
  sections of a tier and renders each per its type. Alternates light/dark
  backgrounds for visual rhythm.
- templates/page-solution-detail.php: WP custom Page Template
  ("Template Name: Solution Detail"). Looks up the current page slug,
  pulls the matching tier from solutions-data.php, and hands off to the
  partial. Falls back gracefully if the slug is unknown.
- templates/page-solutions-overview.php: WP custom Page Template
  ("Template Name: Solutions Overview") for /solutions/. Renders the
  3-tier comparison table + PROSERVE+ teaser.

Pages were seeded into the DB by a one-shot mu-plugin
(wp-content/mu-plugins/asterion-seed-solutions.php in LocalWP) that
created the parent /solutions/ page and 4 children with the right
post_parent + _wp_page_template, then self-deleted.

Verified all 5 URLs return HTTP 200:
  /solutions/                  62 KB
  /solutions/my-proserve/      65 KB
  /solutions/proserve-flex/    65 KB
  /solutions/proserve-academy/ 63 KB
  /solutions/customization/    62 KB

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-05-09 12:22:34 +02:00
parent 773f137eb7
commit 8207c5f72b
4 changed files with 631 additions and 0 deletions

View File

@@ -0,0 +1,120 @@
<?php
/**
* Template Name: Solutions Overview
*
* Custom page template assigned to /solutions/. Renders the 4-tier comparison
* and PROSERVE+ teaser per PDF Strategie & Contenu D.2.
*
* @package AsterionBricks
*/
defined('ABSPATH') || exit;
get_header();
$home_url = home_url('/');
?>
<!-- HERO -->
<section class="av-hero" aria-labelledby="solutions-headline">
<div class="av-hero__media" aria-hidden="true">
<div style="width:100%;height:100%;background:
radial-gradient(ellipse at 30% 30%, rgba(201,164,90,0.15), transparent 60%),
linear-gradient(135deg, #081427 0%, #0B1F3A 50%, #13294B 100%);"></div>
</div>
<div class="av-container">
<div class="av-hero__inner">
<p class="av-hero__eyebrow"><?php esc_html_e('Solutions', 'asterion-bricks'); ?></p>
<h1 id="solutions-headline" class="av-hero__headline" style="font-size:clamp(2.25rem,5vw,var(--text-display-lg));line-height:var(--leading-display-lg);">
One platform. Three formats. Zero rip-and-replace.
</h1>
<p class="av-hero__sub">
Whether you train one officer or sixteen, on a single mission or a full curriculum, PROSERVE&trade; delivers the same software, the same scenarios, the same instructor tools — at the right scale for your operation. Start solo. Add operators. Scale to a full academy. Your investment never resets.
</p>
<div class="av-hero__ctas">
<a href="<?php echo esc_url($home_url . 'request-demo/'); ?>" class="av-btn av-btn--primary av-btn--lg"><?php esc_html_e('Request a Demo', 'asterion-bricks'); ?></a>
</div>
</div>
</div>
</section>
<!-- COMPARISON TABLE -->
<section class="av-section" data-av-reveal>
<div class="av-container">
<div class="av-section__head">
<span class="av-eyebrow"><?php esc_html_e('Compare', 'asterion-bricks'); ?></span>
<h2 class="av-section__title">Compare the three solutions.</h2>
<p class="av-section__lead">
Same software. Same scenarios. Same instructor tools. Different format, different scale.
</p>
</div>
<div style="overflow-x:auto;border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);">
<table style="width:100%;border-collapse:collapse;font-size:var(--text-body-md);min-width:720px;">
<thead>
<tr style="background:var(--color-brand-navy);color:var(--color-text-on-dark);">
<th scope="col" style="padding:var(--space-4);text-align:left;font-weight:var(--font-weight-semibold);"></th>
<th scope="col" style="padding:var(--space-4);text-align:left;font-weight:var(--font-weight-semibold);">MY PROSERVE</th>
<th scope="col" style="padding:var(--space-4);text-align:left;font-weight:var(--font-weight-semibold);">PROSERVE FLEX</th>
<th scope="col" style="padding:var(--space-4);text-align:left;font-weight:var(--font-weight-semibold);">PROSERVE ACADEMY</th>
</tr>
</thead>
<tbody>
<?php
$rows = [
['Trainees', '1 (solo)', '15 (team)', '116 (unit)'],
['Format', 'Mini-case', 'One case per operator + instructor PC', 'Dedicated room + rack + instructor station'],
['Floor space', '3 m² minimum', '9 m² to 100 m²', 'Up to 900 m²'],
['Setup time', '< 5 min', '< 5 min (solo) / 20 min (team)', 'Pre-installed (rapid recalibration)'],
['Multi-user cooperative', 'No', 'Yes (up to 5)', 'Yes (up to 16)'],
['Mobility', 'Ultra-portable', 'Highly portable', 'Fixed'],
['Best for', 'Individual continuous training (police municipale, on-call officers)', 'Tactical teams, mobile units, special operations', 'Academies, central training centres, large units'],
['Indicative price', 'From €9,000 / unit', 'On request', 'On request'],
];
foreach ($rows as $i => $row) :
$bg = ($i % 2 === 0) ? 'transparent' : 'var(--color-bg-subtle)';
?>
<tr style="background:<?php echo esc_attr($bg); ?>;">
<th scope="row" style="padding:var(--space-4);text-align:left;font-weight:var(--font-weight-semibold);color:var(--color-text-primary);border-bottom:1px solid var(--color-border-subtle);">
<?php echo esc_html($row[0]); ?>
</th>
<?php for ($c = 1; $c <= 3; $c++) : ?>
<td style="padding:var(--space-4);color:var(--color-text-secondary);border-bottom:1px solid var(--color-border-subtle);">
<?php echo esc_html($row[$c]); ?>
</td>
<?php endfor; ?>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
<div style="display:flex;flex-wrap:wrap;gap:var(--space-4);margin-top:var(--space-8);">
<a href="<?php echo esc_url($home_url . 'solutions/my-proserve/'); ?>" class="av-btn av-btn--secondary av-btn--md">MY PROSERVE</a>
<a href="<?php echo esc_url($home_url . 'solutions/proserve-flex/'); ?>" class="av-btn av-btn--secondary av-btn--md">PROSERVE FLEX</a>
<a href="<?php echo esc_url($home_url . 'solutions/proserve-academy/'); ?>" class="av-btn av-btn--secondary av-btn--md">PROSERVE ACADEMY</a>
</div>
</div>
</section>
<!-- PROSERVE+ TEASER -->
<section class="av-section av-section--dark" data-av-reveal>
<div class="av-container">
<div style="display:grid;grid-template-columns:1fr;gap:var(--space-10);align-items:center;" class="av-plus-row">
<div style="aspect-ratio:4/3;background:linear-gradient(135deg,#13294B,#081427);border-radius:var(--radius-md);"></div>
<div style="display:flex;flex-direction:column;gap:var(--space-4);">
<span class="av-eyebrow av-eyebrow--gold"><?php esc_html_e('PROSERVE+', 'asterion-bricks'); ?></span>
<h2 class="av-section__title">Need something the catalog doesn&rsquo;t list?</h2>
<p class="av-section__lead">
PROSERVE+&trade; is the customization track. Wrist trackers, haptic vests, custom weapon replicas, bespoke environments, scenarios in your unit&rsquo;s exact uniforms and doctrine. Designed and produced in our French studio.
</p>
<div>
<a href="<?php echo esc_url($home_url . 'solutions/customization/'); ?>" class="av-btn av-btn--primary av-btn--md">
<?php esc_html_e('Explore PROSERVE+ customization', 'asterion-bricks'); ?>
</a>
</div>
</div>
</div>
<style>@media (min-width: 1024px) { .av-plus-row { grid-template-columns: 1fr 1.2fr !important; } }</style>
</div>
</section>
<?php get_footer(); ?>