/* Copyright (c) 2026 Vigeos SASU. Tous droits réservés. */
/* Réservation du kit sur l'accueil FR (demande de Romain du 15/10/2026) :
   formulaire sans paiement, « réserver mon kit » ou « être prévenu de la
   sortie », à la place des renvois vers Kickstarter (site en anglais).
   Repose sur les variables d'accueil.css. */
.reserver-grille { display: grid; grid-template-columns: .9fr 1.1fr; gap: 56px; align-items: start; }
.reserver .liste { margin-bottom: 22px; }
.formulaire {
  background: var(--carte); border: 1px solid rgba(126, 179, 255, .45); border-radius: var(--rayon);
  padding: 32px; box-shadow: 0 30px 80px -40px rgba(37, 99, 235, .8);
}
.choix { border: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 22px; }
.choix legend { font-family: var(--font-titre); font-weight: 600; color: var(--blanc); margin-bottom: 12px; }
.choix label {
  display: flex; gap: 12px; align-items: flex-start; padding: 16px; border-radius: 16px; cursor: pointer;
  border: 1px solid var(--carte-bord); background: rgba(255, 255, 255, .03);
  font-family: var(--font-titre); font-weight: 600; font-size: .98rem; line-height: 1.35; color: var(--blanc);
}
.choix label:has(input:checked) { border-color: var(--ciel); background: rgba(37, 99, 235, .2); }
.choix input { accent-color: var(--royal-2); width: 20px; height: 20px; margin-top: 1px; flex: none; }
.choix small { display: block; margin-top: 4px; font-family: var(--font-body); font-weight: 400; font-size: .85rem; color: var(--texte); }
.champs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.champ { display: flex; flex-direction: column; gap: 6px; font-family: var(--font-titre); font-size: .9rem; color: var(--texte); }
.champ.plein { grid-column: 1 / -1; }
.champ input, .champ select {
  min-height: 52px; padding: 0 16px; border-radius: 14px; font-family: var(--font-body); font-size: 1rem;
  color: var(--blanc); background: rgba(255, 255, 255, .06); border: 1px solid var(--carte-bord);
}
.champ select option { color: #0C1A33; }
.champ input:focus-visible, .champ select:focus-visible { outline: 3px solid var(--ciel); outline-offset: 2px; }
.champ .facultatif { color: var(--doux); font-weight: 400; }
.champ[hidden] { display: none; }
.formulaire .bouton { width: 100%; margin-top: 22px; }
.formulaire .bouton:disabled { opacity: .7; cursor: progress; transform: none; }
.formulaire-etat { margin-top: 14px; font-size: .95rem; color: var(--blanc); }
.formulaire-etat.erreur { color: var(--orange); }
.formulaire-note { margin-top: 14px; font-size: .82rem; color: var(--doux); }
.formulaire-merci h3 { font-size: 1.4rem; margin-bottom: .5em; }
.formulaire-merci p { color: var(--blanc); }
.formulaire-merci[hidden], .formulaire form[hidden] { display: none; }

@media (max-width: 900px) {
  .reserver-grille { grid-template-columns: 1fr; gap: 32px; }
}
@media (max-width: 520px) {
  .formulaire { padding: 22px; }
  .choix, .champs { grid-template-columns: 1fr; }
}

/* Kickstarter en second choix, à côté de la réservation (demande de Romain du
   15/10/2026 : « un vrai bouton pour Kickstarter »). */
.bandeau-actions, .offre-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.ks-bloc { margin-top: 8px; padding-top: 24px; border-top: 1px solid var(--carte-bord); }
.ks-titre { font-family: var(--font-titre); font-weight: 600; color: var(--blanc); margin-bottom: 12px; }
.ks-bloc .source { margin-top: 12px; }
@media (max-width: 520px) {
  .bandeau-actions .bouton, .offre-actions .bouton, .ks-bloc .bouton { width: 100%; text-align: center; }
}