/* « Réserver une démo » (12/11/2026) : la feuille de l'accueil d'abord
   (accueil/accueil.css : jetons, polices, boutons, en-tête, pied), puis ceci.
   Aucune couleur nouvelle : les jetons de l'accueil.

   Ce qui dépend du choix du visiteur se fait par `:has()`, sans script :
   l'heure de Malte sous chaque créneau, l'option « en personne » retirée à
   Malte, le champ d'adresse caché pour une visio, « Plus de dates » au
   téléphone. Sans `:has()`, tout reste montré : rien n'est perdu. */

.demo-tete{padding:56px 0 8px}
.demo-titre{font-size:clamp(42px,6vw,72px);margin:14px 0 18px}
.demo-corps{padding:24px 0 80px}
.demo-form{display:grid;gap:30px;max-width:980px}
.demo-etape{display:grid;gap:14px}
.demo-h2{display:flex;align-items:center;gap:12px;font:600 18px var(--sans);letter-spacing:0;margin:0}
.demo-h2 span{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--paper);font-size:14px}
.demo-form label,.demo-label{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.demo-form input[type=text],.demo-form input[type=email],.demo-form input[type=tel],.demo-form textarea{width:100%;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:12px 14px;color:var(--ink);font:400 16px var(--sans)}
.demo-form textarea{resize:vertical}
.demo-form input:focus,.demo-form textarea:focus{outline:2px solid var(--rust);outline-offset:1px}
.demo-champs{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.demo-erreur{color:var(--rust-deep);font-size:14.5px;margin:6px 0 0;font-weight:500}
.demo-note{font-size:14px;color:var(--muted);margin:-14px 0 0}
.demo-envoyer{justify-self:start;padding:15px 30px;font-size:16px}

/* choix à pastilles : pays, format */
.demo-seg{display:flex;flex-wrap:wrap;gap:10px}
.demo-seg label{margin:0;cursor:pointer;font-size:inherit;letter-spacing:0;text-transform:none;color:inherit}
.demo-seg input,.creneau input,.cal-plus input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.demo-seg span{display:block;border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:10px 18px;font:500 15px var(--sans)}
.demo-seg input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.demo-seg input:focus-visible+span,.creneau input:focus-visible+span,.cal-plus input:focus-visible+span{outline:2px solid var(--rust);outline-offset:2px}
.note-malte{display:none;font-size:14px;color:var(--muted);margin:8px 0 0}
.demo-page:has(#pays-mt:checked) .option-personne{display:none}
.demo-page:has(#pays-mt:checked) .note-malte{display:block}
.demo-page:has(#format-visio:checked) #champ-adresse,.demo-page:has(#pays-mt:checked) #champ-adresse{display:none}

/* le calendrier : une grille lundi .. vendredi */
.cal{display:grid;gap:8px}
.cal-legende{margin:0;font-size:14px;color:var(--muted)}
.cal-entete,.cal-semaine{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.cal-entete span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding-left:4px}
.cal-jour{margin:0;min-width:0;border:1px solid var(--line);background:var(--paper);border-radius:12px;padding:10px;display:grid;gap:6px;align-content:start}
.cal-jour legend{float:left;width:100%;padding:0;margin-bottom:4px;font:600 13.5px var(--sans)}
.cal-jour.vide{background:transparent}
.cal-jour.vide legend{color:var(--muted);font-weight:500}
.cal-long{display:none}
.creneau{display:block;margin:0;cursor:pointer;font-size:inherit;letter-spacing:0;text-transform:none;color:inherit}
.demo-form .creneau{margin:0;font-size:inherit;letter-spacing:0;text-transform:none;color:inherit}
.creneau span{display:flex;flex-direction:column;align-items:center;border:1px solid var(--line);background:var(--bg);border-radius:10px;padding:7px 4px;font:500 15px var(--sans);line-height:1.2}
.creneau span:hover{border-color:var(--rust)}
.creneau input:checked+span{background:var(--rust);border-color:var(--rust);color:var(--paper)}
.heure-malte{display:none;font-size:12px;font-weight:400;opacity:.8}
.demo-page:has(#pays-mt:checked) .heure-malte,.demo-page.pays-mt .heure-malte{display:inline}
.creneau .heure-malte{display:none}
.demo-page:has(#pays-mt:checked) .creneau .heure-malte,.demo-page.pays-mt .creneau .heure-malte{display:block}
.aucun{color:var(--muted);font-size:14px}
.demo-form .cal-plus{display:none}

/* la page du rendez-vous */
.demo-carte{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:24px 28px;max-width:640px;margin-bottom:28px}
.demo-carte p{margin:4px 0}
.demo-carte.annulee{opacity:.7}
.demo-carte.annulee .demo-quand{text-decoration:line-through}
.demo-quand{font:400 26px/1.2 var(--serif)}
.demo-quand-malte{color:var(--muted)}
.demo-actions{display:grid;gap:40px}
.demo-annuler{display:grid;gap:12px;justify-items:start}

@media (max-width:760px){
  .demo-tete{padding:32px 0 0}
  .demo-champs{grid-template-columns:1fr}
  .demo-envoyer{justify-self:stretch}
  /* Au téléphone : une liste, jamais un jour vide en tête. */
  .cal-entete,.cal-case-vide,.cal-jour.vide{display:none}
  .cal-semaine{display:contents}
  .cal-jour{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cal-jour legend{grid-column:1/-1}
  .cal-court{display:none}
  .cal-long{display:inline}
  .cal-jour.loin{display:none}
  .cal-jour.loin:has(input:checked){display:grid}
  .demo-form .cal-plus{display:block;justify-self:start;margin:4px 0 0;cursor:pointer;font-size:inherit;letter-spacing:0;text-transform:none;color:inherit}
  .cal-plus span{display:block;border:1px solid var(--line);border-radius:999px;padding:9px 18px;font:500 14.5px var(--sans);background:var(--paper)}
  .cal:has(#plus-de-dates:checked) .cal-jour.loin{display:grid}
  .cal:has(#plus-de-dates:checked) .cal-plus{display:none!important}
  .demo-retour{display:none}
  /* La barre : le logo et FR | EN sur une ligne (l'accueil, lui, la replie). */
  .demo-page .nav{flex-wrap:nowrap;height:60px;padding:0}
  .demo-page .nav-right{width:auto;margin-left:auto}
}