Files
chesscubing/index.html

258 lines
11 KiB
HTML

<!doctype html>
<html lang="fr">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<meta name="theme-color" content="#140700" />
<meta name="application-name" content="ChessCubing Arena" />
<meta name="mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="ChessCubing" />
<meta
name="description"
content="Découvrez ChessCubing, l'association et le jeu qui réunit échecs et Rubik's Cube dans un format simple, vivant et spectaculaire."
/>
<title>ChessCubing Arena | Accueil</title>
<link rel="icon" type="image/png" href="/favicon.png" />
<link rel="shortcut icon" href="/favicon.png" />
<link rel="apple-touch-icon" href="logo.png" />
<link rel="manifest" href="site.webmanifest" />
<link rel="stylesheet" href="styles.css" />
</head>
<body class="home-body">
<div class="ambient ambient-left"></div>
<div class="ambient ambient-right"></div>
<div class="rules-shell">
<header class="hero hero-home">
<div class="hero-copy">
<a class="logo-lockup" href="index.html" aria-label="Accueil ChessCubing">
<img class="hero-logo-icon" src="logo.png" alt="Icône ChessCubing" />
<img class="hero-logo" src="transparent.png" alt="Logo ChessCubing" />
</a>
<p class="eyebrow">Association ChessCubing</p>
<h1>Les échecs rencontrent le Rubik's Cube</h1>
<p class="lead">
ChessCubing propose un jeu hybride simple à comprendre, intense à
vivre et très plaisant à regarder. On joue une partie d'échecs, on
passe par une phase cube obligatoire, puis la partie repart avec un
nouveau rythme.
</p>
<div class="hero-actions">
<a class="button primary" href="application.html">Ouvrir l'application</a>
<a class="button secondary" href="reglement.html">Lire le règlement</a>
<a class="button ghost" href="/ethan/">Ouvrir l'appli d'Ethan</a>
</div>
</div>
<aside class="hero-preview">
<div class="preview-card">
<p class="micro-label">Le principe</p>
<ol class="phase-list">
<li>Deux joueurs disputent une partie d'échecs courte et nerveuse.</li>
<li>Une phase cube coupe le rythme et relance la tension.</li>
<li>Le résultat du cube influence immédiatement la suite du match.</li>
</ol>
</div>
<div class="preview-banner">
<span class="mini-chip">Découverte rapide</span>
<strong>On comprend en quelques minutes</strong>
<p>
Le format donne envie de jouer même quand on découvre seulement
l'un des deux univers. On peut venir pour les échecs, pour le
cube, ou simplement pour l'énergie du duel.
</p>
</div>
</aside>
</header>
<main class="rules-grid">
<section class="panel panel-wide">
<div class="section-heading">
<div>
<p class="eyebrow">L'association</p>
<h2>Une passerelle entre deux passions</h2>
</div>
<p class="section-copy">
L'association ChessCubing veut créer des moments de rencontre, de
découverte et de jeu partagé autour d'un format hybride.
</p>
</div>
<div class="home-story-grid">
<article class="stage-card">
<span class="micro-label">Partager</span>
<strong>Faire découvrir un format original</strong>
<p>
L'idée est simple : réunir des profils différents autour d'un
jeu lisible, vivant et immédiatement intriguant.
</p>
</article>
<article class="stage-card">
<span class="micro-label">Rassembler</span>
<strong>Créer un terrain commun</strong>
<p>
Joueurs d'échecs, cubers, curieux, familles ou clubs peuvent se
retrouver dans une expérience facile à lancer et à commenter.
</p>
</article>
<article class="stage-card">
<span class="micro-label">Animer</span>
<strong>Donner envie de revenir jouer</strong>
<p>
Le mélange de réflexion, de vitesse et de rebondissements donne
au format un côté spectaculaire qui marche très bien en
initiation comme en événement.
</p>
</article>
</div>
</section>
<section class="panel panel-half">
<div class="section-heading">
<div>
<p class="eyebrow">Le jeu en simple</p>
<h2>Comment se passe une partie</h2>
</div>
</div>
<div class="home-mini-grid">
<article class="mini-panel">
<span class="micro-label">1</span>
<strong>On joue une partie d'échecs</strong>
<p>
La partie avance par séquences courtes, ce qui garde un très bon
rythme et rend l'action facile à suivre.
</p>
</article>
<article class="mini-panel">
<span class="micro-label">2</span>
<strong>On résout un cube</strong>
<p>
Les deux joueurs enchaînent avec une phase cube obligatoire qui
sert de relance, de pression et de bascule.
</p>
</article>
<article class="mini-panel">
<span class="micro-label">3</span>
<strong>Le match repart</strong>
<p>
Selon le mode choisi, la phase cube donne l'initiative ou agit
sur les chronos. Le duel ne retombe jamais.
</p>
</article>
</div>
</section>
<section class="panel panel-half">
<div class="section-heading">
<div>
<p class="eyebrow">Pourquoi ça plaît</p>
<h2>Un format qui donne envie d'essayer</h2>
</div>
</div>
<div class="home-mini-grid two-columns">
<article class="mini-panel">
<strong>Très lisible</strong>
<p>On comprend vite quand la pression monte et pourquoi le cube change tout.</p>
</article>
<article class="mini-panel">
<strong>Toujours relancé</strong>
<p>Chaque phase cube remet du suspense dans la partie et ouvre de nouvelles options.</p>
</article>
<article class="mini-panel">
<strong>Convivial</strong>
<p>Le format marche bien en initiation, en animation de club ou en démonstration publique.</p>
</article>
<article class="mini-panel">
<strong>Mémorable</strong>
<p>On ressort d'une partie avec des coups, des temps et des retournements dont on se souvient.</p>
</article>
</div>
</section>
<section class="panel panel-wide">
<div class="section-heading">
<div>
<p class="eyebrow">Deux formats</p>
<h2>Deux manières de vivre le duel</h2>
</div>
<p class="section-copy">
Le règlement officiel propose deux lectures du même concept, l'une
plus orientée initiative, l'autre plus orientée gestion du temps.
</p>
</div>
<div class="rules-compare">
<article class="format-card twice-card">
<div class="format-head">
<span class="mini-chip">ChessCubing Twice</span>
<h3>Le cube donne l'élan</h3>
<p>
Le joueur le plus rapide sur la phase cube prend le départ de
la partie suivante et peut même obtenir un double coup dans
certaines situations.
</p>
</div>
<div class="format-badges">
<span>Mode nerveux</span>
<span>Initiative forte</span>
<span>Effet immédiat</span>
</div>
</article>
<article class="format-card time-card">
<div class="format-head">
<span class="mini-chip">ChessCubing Time</span>
<h3>Le cube agit sur les chronos</h3>
<p>
Ici, on garde le trait mais la performance sur le cube retire
ou ajoute du temps selon l'alternance des blocs.
</p>
</div>
<div class="format-badges">
<span>Gestion de temps</span>
<span>Blocs - et +</span>
<span>Suspense permanent</span>
</div>
</article>
</div>
</section>
<section class="panel panel-wide cta-panel">
<div class="section-heading">
<div>
<p class="eyebrow">Envie de tester</p>
<h2>Choisis ton entrée</h2>
</div>
<p class="section-copy">
Tu peux découvrir le jeu tranquillement avec la page règlement ou
aller directement vers l'application officielle de match.
</p>
</div>
<div class="source-grid">
<a class="source-card" href="application.html">
<span class="micro-label">Application</span>
<strong>Ouvrir la partie arbitrage</strong>
<p>Configurer une rencontre, lancer le chrono et enchaîner avec la phase cube.</p>
</a>
<a class="source-card" href="reglement.html">
<span class="micro-label">Règlement</span>
<strong>Comprendre les formats officiels</strong>
<p>Retrouver une présentation claire du Twice, du Time et des règles de match.</p>
</a>
<a class="source-card" href="ChessCubing_Twice_Reglement_Officiel_V2-1.pdf" target="_blank">
<span class="micro-label">PDF officiel</span>
<strong>Lire le texte source</strong>
<p>Consulter directement le document officiel si tu veux tous les détails.</p>
</a>
</div>
</section>
</main>
</div>
</body>
</html>