/* La page de prise de rendez-vous (/fr/rendez-vous, 2026-10-27). Écrite à la main, hors de la
   maquette, comme la page des tarifs : le portage ne la touche pas. Deux colonnes au-dessus de
   1100 px : le texte en haut à gauche, les coordonnées en bas à gauche, l'agenda à droite ; une
   seule colonne en dessous, dans l'ordre du source (sous 1100 px, la colonne de gauche couperait
   « rendez-vous »).
   Sur ordinateur, la page tient en un écran, pied de page compris (retour de Hugues du 27-10) :
   l'agenda suit la hauteur de la fenêtre, entre 560 et 620 px (602 px dans une fenêtre de 730 px,
   celle du Chrome de Hugues), et le pied reste en bas de l'écran. Le pied perd la réserve de 100 px
   qu'il garde ailleurs pour le bouton flottant, absent de cette page.
   Calendly change d'aspect avec la hauteur du cadre (mesuré le 2026-10-27) : au-dessus d'environ
   650 px de haut ou 700 px de large, il dessine sa propre carte ; en dessous, une feuille blanche
   sans bord. Les plafonds de 620 px de haut et 640 px de large le gardent partout en feuille
   blanche, à laquelle la page donne un filet : un seul
   aspect, du téléphone au grand écran, et jamais une carte dans une carte. Le cadre reste dans les
   marges de la page (aligné sur le titre ; bord à bord, Calendly débordait à droite sur téléphone).
   Tant qu'il n'a rien peint, il reste transparent et laisse lire la ligne de chargement posée
   derrière lui. Une fois une date choisie, Calendly fait défiler les horaires dans son cadre. */
.rv { padding: 16px 0 0; }
/* Le pied en bas de l'écran : 64 px de barre, 48 px de pied. */
.page-rdv { min-height: calc(100vh - 112px); min-height: calc(100svh - 112px); }
.page-rdv + .pied { padding-top: 12px; padding-bottom: 16px; }
.rv-grille {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 640px); grid-template-rows: auto 1fr;
  grid-template-areas: "texte agenda" "contact agenda"; column-gap: 56px;
}
.rv-texte { grid-area: texte; padding-top: 28px; }
.page-rdv h1 { max-width: 11ch; }
.rv-texte .sous { margin: 20px 0 0; max-width: 40ch; }
.rv-feuille {
  grid-area: agenda; position: relative; align-self: start; width: 100%; max-width: 640px;
  background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden;
}
.rv-feuille::before {
  content: attr(data-chargement); position: absolute; inset: 0; display: grid; place-items: center;
  font-size: 15px; color: var(--ink-3);
}
.rv-cadre {
  position: relative; display: block; width: 100%; border: 0; background: transparent; color-scheme: light;
  height: clamp(560px, calc(100vh - 130px), 620px); height: clamp(560px, calc(100svh - 130px), 620px);
}
.rv-contact { grid-area: contact; align-self: end; padding: 32px 0 12px; }
.rv-contact-titre { font-size: 14px; color: var(--ink-2); margin-bottom: 2px; }
.rv-contact p:not(.rv-contact-titre):not(.rv-repli) { font-size: 16px; letter-spacing: -0.011em; }
.rv-contact a { color: var(--ink); text-underline-offset: 3px; }
.rv-contact p:not(.rv-contact-titre):not(.rv-repli) a { display: inline-block; padding: 4px 0; text-decoration: none; }
.rv-contact p:not(.rv-contact-titre):not(.rv-repli) a:hover { text-decoration: underline; }
.rv-repli { margin: 16px 0 0; max-width: 40ch; font-size: 14px; line-height: 1.55; color: var(--ink-3); }
@media (max-width: 1100px) {
  .rv { padding: 44px 0 40px; }
  .rv-grille { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; grid-template-areas: "texte" "agenda" "contact"; }
  .rv-texte { padding-top: 0; }
  .page-rdv h1 { max-width: 16ch; }
  .rv-texte .sous { max-width: 52ch; }
  .rv-feuille { margin-top: 24px; }
  .rv-cadre { height: 620px; }
  .rv-contact { padding: 24px 0 0; }
  .rv-repli { max-width: 60ch; }
}
@media (max-width: 640px) {
  .rv { padding-top: 32px; }
  .rv-feuille { border-radius: 10px; }
  .rv-cadre { height: 600px; }
  /* Cibles tactiles d'au moins 44 px pour l'adresse et le téléphone. */
  .rv-contact p:not(.rv-contact-titre):not(.rv-repli) a { padding: 11px 0; }
}
