/* Page Réserver une démo — mises en page propres à la page. Composants : ds.css. */

.demo-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: var(--space-5); align-items: center; padding-block: var(--space-5); }
.demo-copy { display: flex; flex-direction: column; gap: var(--space-3); }
.demo-form { padding: var(--space-4); }
.demo-form .form__actions { margin-top: var(--space-2); }

/* Messages de confirmation et d'erreur */
.alert { display: flex; gap: var(--space-3); align-items: flex-start; padding: var(--space-3); border-radius: var(--radius-md); background: var(--color-bg-green-pale); border: 1px solid var(--color-border-green); }
.alert .icon-tile { flex: none; }
.alert--error { background: var(--color-bg-orange-pale); border-color: var(--color-border-orange); }
.alert strong { display: block; margin-bottom: var(--space-1); font-weight: var(--weight-medium); color: var(--color-text-primary); }

/* Champ piège : invisible pour les personnes, rempli par les robots. */
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 1023px) {
  .demo-layout { grid-template-columns: 1fr; gap: var(--space-4); padding-block: var(--space-4); }
}
@media (max-width: 767px) {
  .demo-form { padding: var(--space-3); }
  .demo-form .form__actions .btn { width: 100%; }
}