/* ── src/refonte/raphael.css ── */
/* ───── Le mini-site Raphaël, au thème de la refonte (v402, 17 octobre 2026) ─────
   Raphaël, 8 h 45 : « toutes ces pages-là, le site principal, Raphaël, journal, galerie et bac à sable, sur le même thème ».
   La page prend refonte.css (chargée avant celle-ci) et ses composants tels quels : rf-ecran / reg-a / reg-c, rf-grille, t-*, link-btn,
   btn-pill, rf-portrait, rf-carte, rf-articles (la mosaïque en colonnes du Journal), rf-appels. Ici, seulement la place des choses,
   et deux mises en page NOUVELLES faites avec les jetons du système : les étapes fixes (rf-mini-etapes) et les listes d'informations
   (rf-mini-infos). Le parcours en orbites garde les styles du site (35-sections.css, injectés à la construction). */

/* le haut : le texte à gauche, le portrait à droite, centrés en hauteur */
#haut-raphael > .rf-grille { row-gap: var(--rf-e3); }   /* v493 : l'alignement vient de .rf-raphael (refonte.css), en colonne comme dans la coulisse */
.rf-mini-sommaire { display: flex; flex-wrap: wrap; gap: var(--rf-e1) var(--rf-e2); }

/* le portfolio : la mosaïque du Journal, une colonne de plus sur grand écran ; chaque image garde son format */
.rf-mini .rf-mosaique { margin-top: 0; }
@media (min-width: 1280px) { .rf-mini .rf-mosaique { columns: 4; } }
.rf-mini .rf-mosaique .rf-carte { break-inside: avoid; margin-bottom: var(--rf-e3); }

/* le parcours : le dessin du site, sur toute la largeur de la grille ; sur grand écran, une hauteur fixe (le dessin se construit à la
   taille de son cadre, comme dans la rubrique du site : 35-sections.css, #raphael .rub-step .pc-fig) */
.rf-mini .pc-fig { width: 100vw; max-width: 100vw; margin: 0 calc(50% - 50vw); }   /* v493 (Raphaël, 11 h 41 : « le parcours orbite prend 100vw ») : sort de la grille, d'un bord à l'autre */
@media (min-width: 761px) { .rf-mini .pc-fig { height: min(78svh, 46vw); padding: 0; } .rf-mini .pc-h { height: 100%; } }

/* NOUVEAU · les étapes fixes : cinq colonnes sous un filet (le filet et le pas des étapes de la page de vente, sans la case à cocher) */
.rf-mini-etapes { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--rf-e3) var(--rf-e3); margin: 0; padding: 0; list-style: none; counter-reset: etape; }
/* v493 (Raphaël, 11 h 41 : « des indices chiffrés 1. Découverte, 2. Plan d'action ; sépare plus les éléments ») : le numéro en tête du
   sous-titre (compteur, l'ol reste une liste ordonnée pour le lecteur d'écran), plus d'air entre les colonnes et sous le filet */
.rf-mini-etapes li { display: grid; gap: var(--rf-e2); align-content: start; padding-top: var(--rf-e2); border-top: 1px solid var(--line-strong); counter-increment: etape; }
.rf-mini-etapes li > .t-sous::before { content: counter(etape) ". "; }
@media (max-width: 1023px) { .rf-mini-etapes { grid-template-columns: 1fr 1fr; } }
@media (max-width: 767px) { .rf-mini-etapes { grid-template-columns: 1fr; } }

/* principes, centres d'intérêt, informations : une liste sous des filets */
.rf-mini-deux { row-gap: var(--rf-e4); }
.rf-mini-deux h3 { margin: 0 0 var(--rf-e2); }
.rf-mini-infos dd { margin: 0; }   /* v415 : la liste sous filets est devenue .rf-liste, commune (refonte.css) */
/* NOUVEAU · les informations : l'intitulé en petit à gauche, la valeur à droite */
.rf-mini-infos { display: grid; margin: 0; }
.rf-mini-infos > div { display: grid; grid-template-columns: minmax(96px, 1fr) 3fr; gap: var(--rf-e2); padding-block: var(--rf-e2); border-top: 1px solid var(--line); }
.rf-mini-infos dt { color: var(--ink-2); }
.rf-mini-citation { margin: 0; display: grid; gap: var(--rf-e2); align-content: start; }
.rf-mini-citation blockquote { margin: 0; }
.rf-mini-citation blockquote p { margin: 0; }
.rf-mini-devise .rf-col { display: grid; gap: var(--rf-e1); margin-block: var(--rf-e3); }   /* v431 : la devise, avant les appels */