/* ═══════════════════════════════════════════════════════════════════════════
   fond.css — LE FOND CLAIR DU TÉLÉPHONE, UN SEUL POUR TOUT LE SITE
   ═══════════════════════════════════════════════════════════════════════════

   Chargé par les SIX pages avec media="(max-width: 768px)", et c'est là son
   intérêt : mobile.css n'est chargée que par l'accueil, les tarifs et les
   réalisations, si bien que les trois pages légales gardaient l'aurora du
   bureau. Mesuré le 17/08/2026 sur un téléphone de 390px : leur fond tombait
   à 213,228,255 quand le reste du site était à 239,241,254. C'était le plus
   gros écart de fond du site, et il ne se voyait pas parce que personne ne
   descend ces pages sur téléphone.

   Ce fichier ne contient QUE le fond. Rien d'autre, jamais : les pages
   légales n'ont ni mobile.js, ni barre d'action basse, ni menu burger, et
   toute règle de mise en page ajoutée ici leur arriverait sans le script qui
   va avec. Une règle de mise en page téléphone va dans mobile.css.

   Le fond, décidé par Léon le 17/08/2026 : la version claire du site doit
   être HOMOGÈNE d'un bout à l'autre, sans jonction visible. Les sections au
   fond sombre gardent le leur, elles seules ont le droit de trancher. Tout
   fond clair qu'une section poserait ferait une frontière : mobile.css les
   neutralise (voir sa section 01).

   Deux couches, et aucune couche fixe. `background-attachment: fixed` est
   exactement ce qui coûtait une passe de composition plein écran à chaque
   image, et c'est pour ça que l'aurora avait été coupée en août. Ici le fond
   est peint une fois, le défilement ne le retouche pas.

   La couche horizontale couvre la page en une fois : indigo à gauche, cyan à
   droite. La verticale se répète tous les 1800px, et ses deux extrémités sont
   la MÊME couleur : c'est ce qui rend le raccord invisible. Ne jamais y poser
   de tache radiale centrée sur un bord, elle serait tronquée d'un côté et le
   raccord se lirait comme une ligne en travers de la page.

   Les opacités sont quatre à cinq fois plus basses que celles de l'aurora du
   bureau. C'est ce qui écarte le délavé qui avait fait couper celle-ci : sur
   390px de large, les taches de l'aurora se recouvraient toutes et chaque
   écran baignait dans un lavis bleu laiteux.
   ------------------------------------------------------------------------ */

/* L'aurora et le grain du bureau ne conviennent pas à 390px de large, et
   l'aurora des pages légales tourne en plus une animation infinie que
   frame.js n'y surveille pas. */
.bg-aurora { display: none !important; }
.grain     { display: none !important; }

/* Sur `html`, et surtout pas sur `body`. Les six pages écrivent toutes
   `html { background: #ffffff }` et `body { background: transparent }` :
   comme html porte déjà un fond, celui de body n'est plus propagé au canevas,
   et le fond de body s'arrête alors à sa boîte de bordure. Posé sur body, le
   voile laissait donc du blanc pur partout où le canevas dépasse : les deux
   rebonds de défilement d'iOS, en haut comme en bas, et le bas de page quand
   le document est plus court que l'écran. Sur html, il couvre tout.

   #ffffff en clair plutôt que var(--m-paper) ou var(--bg) : ces variables sont
   déclarées l'une dans mobile.css, que les pages légales ne chargent pas,
   l'autre dans chaque page. Même valeur partout, vérifié sur les six. */
html {
  background:
    linear-gradient(90deg, rgba(106, 92, 255, 0.05), transparent 42%,
                           transparent 58%, rgba(0, 178, 255, 0.045)),
    linear-gradient(180deg, rgba(106, 92, 255, 0.045) 0%,
                            rgba(0, 178, 255, 0.04) 50%,
                            rgba(106, 92, 255, 0.045) 100%),
    #ffffff !important;
  background-size: 100% 100%, 100% 1800px !important;
  background-repeat: no-repeat, repeat !important;
  background-attachment: scroll !important;
}