/* jb4wood-core-desktop.css — généré automatiquement. Contient ce que jb4wood-core.css a en plus de jb4wood-core-lean.css : le calque décoratif body::before (texture béton + parallaxe). Chargé via media="(min-width: 769px)". La variante tactile est ajoutée en FIN de fichier (voir son commentaire). */ body::before { content: ''; position: fixed; inset: 0; /* couvre tout le viewport */ z-index: -1; background-image: url('/medias/2026/04/fond-jb4wood-sandwich.webp'); background-size: cover; background-position: center var(--bg-y); background-attachment: scroll; background-repeat: repeat-y; /* Filter baké dans le WebP source (brightness 0.98 + contrast 1.65 + saturate 1.08 pré-appliqués) → 0 calcul runtime. Le rendu est visuellement identique. */ pointer-events: none; will-change: background-position; } /* FIABILITE iPad/tactile (2026-05-23) : sur appareil tactile, le JS pose body.jb-no-parallax (--bg-y ne bouge plus) ; on retire AUSSI le will-change pour que ce calque fixe plein ecran ne soit plus promu/re-rasterise en continu. Le backdrop-filter du header ne re-echantillonne donc plus un calque qui bouge a chaque frame => fin du repaint/frame qui faisait planter Safari iPad apres quelques minutes. La texture reste affichee (statique). Desktop souris = inchange. */ body.jb-no-parallax::before { will-change: auto !important; } /* MENU OUVERT : on NE TOUCHE PAS au fond (pas de flou, pas d'assombrissement). Tailles ajustées 05/2026 : +15% pour mieux voir les effets de transparence tout en gardant la finesse de la texture. */ @media (min-width: 1440px) { body::before { background-size: 1800px 1800px; /* desktop large : taille fixe au lieu de cover */ background-repeat: repeat; } } @media (max-width: 1439px) and (min-width: 769px) { body::before { background-size: 1500px 1500px; /* medium : 1280 → 1500 (+17%) */ background-repeat: repeat; } } @media (max-width: 768px) { body::before { /* Mobile (2026-05-18) : profileur iPhone = 97% Dessin+Styles, 0% JS. Cause = cet élément position:fixed plein écran + will-change repeint plein écran à CHAQUE frame de scroll. Inutile sur mobile (texture déjà retirée). On le SUPPRIME → couleur béton du body affichée à la place (zéro changement visuel mobile), fin du repaint par frame. */ display: none !important; background-image: none; background-size: 900px 900px; /* conservé (sans effet si image:none) */ background-repeat: repeat; } /* ── 04/08/2026 — L'IPAD RETROUVE LA TEXTURE BÉTON ────────────────── Jérémy, 04/08 : « Sur iPad j'ai un fond uni et plus l'effet béton. » Cause mesurée : cette feuille était chargée sous (hover:hover) and (pointer:fine), ce qui exclut tout appareil tactile. Elle porte le `content:''` de body::before — sans lui le pseudo-élément n'existe pas, et il ne restait que la couleur unie #e8e4e0 (--jb-beton). La condition avait une raison : un calque `position:fixed` plein écran a un historique de plantage sur Safari/iPad. On ne la remet donc pas ; on peint la texture DIRECTEMENT sur pour les tactiles — pas de pseudo-élément, pas de position:fixed, pas de couche de composition. Ce qu'on perd : le parallaxe (--bg-y). Ce qu'on gagne : la texture, et aucun risque de plantage. ── */ @media (pointer: coarse) { body::before { display: none !important; } body { background-image: url('/medias/2026/04/fond-jb4wood-sandwich.webp') !important; background-size: cover !important; background-position: center top !important; background-attachment: scroll !important; background-repeat: repeat-y !important; } }