/* ═══════════════════════════════════════════════════════════
   LES QUATRE ESSAIS DU CONFIGURATEUR SUR TÉLÉPHONE
   ═══════════════════════════════════════════════════════════

   Relevé sur le configurateur en service, iPhone 390 × 844, au chargement
   de l'atelier — c'est ce chiffre-là qu'il faut battre :

     en-tête ................  78 px
     « autre modèle » .......  38 px
     la montre .............. 339 px   40 %
     les options ............  99 px   12 %   ← ce qu'on est venu faire
     le rail des étapes .....  70 px  \  178 px, 21 % de l'écran
     le socle prix + panier . 108 px  /

   Quatre chemins, quatre feuilles. Celle-ci ne porte que ce qui leur est
   commun : le bandeau qui nomme l'essai et permet de passer de l'un à
   l'autre sans repasser par le clavier. Rien ici ne touche au
   configurateur en service — les essais sont des COPIES, et la feuille de
   l'essai se charge APRÈS `configurateur.css`.
   ═══════════════════════════════════════════════════════════ */

.essai-bandeau{
  position:fixed;left:0;right:0;top:0;z-index:2147482000;
  display:flex;align-items:center;gap:0;
  font-family:var(--display,'Oswald',sans-serif);
  font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;
  background:#111114;color:#fff;
  padding:0 0 0 10px;
  height:30px;
  box-shadow:0 1px 0 rgba(0,0,0,.25)}
.essai-bandeau b{font-weight:600;white-space:nowrap;margin-right:auto;opacity:.92}
.essai-bandeau a{
  display:flex;align-items:center;justify-content:center;
  width:30px;height:30px;color:#fff;text-decoration:none;opacity:.42;
  border-left:1px solid rgba(255,255,255,.14)}
.essai-bandeau a.on{opacity:1;background:#c8102e}

/* Le bandeau pousse tout le reste vers le bas : l'en-tête du site est
   lui-même `fixed`, on ne peut pas se contenter d'une marge sur `body`. */
body.essai-cfg{--essai-h:30px}
body.essai-cfg .entete{top:var(--essai-h)}
body.essai-cfg main,
body.essai-cfg #cfg-racine,
body.essai-cfg #cfg-atelier{padding-top:calc(var(--header) + var(--essai-h) + 10px)}

/* Les essais qui SUPPRIMENT l'en-tête ne lui réservent rien : cette réserve
   gardait 88 px de blanc au-dessus de la montre alors que l'en-tête n'était
   plus là. Relevé le 21/09/2026 sur l'essai A — la montre commençait encore
   au pixel 118. Il ne reste que la hauteur du bandeau d'essai. */
body.essai-a main, body.essai-a #cfg-racine, body.essai-a #cfg-atelier,
body.essai-e main, body.essai-e #cfg-racine, body.essai-e #cfg-atelier{
  padding-top:var(--essai-h)}
body.essai-a .entete, body.essai-e .entete{top:0}

@media(min-width:901px){
  /* Ces essais ne concernent que le téléphone : sur un grand écran, la page
     reste celle du configurateur en service, bandeau compris pour qu'on
     sache où l'on est. */
  body.essai-cfg #cfg-atelier{padding-top:calc(var(--header) + var(--essai-h) + 22px)}
}