/* ============================================================ v92.2 Quick-wins audit pré-rentrée 2026 Mobile UX + Accessibilité + Performance ============================================================ */ /* 1. Anti horizontal-scroll mobile */ html, body { overflow-x: hidden; max-width: 100vw; } /* 2. Touch targets ≥ 44px sur mobile (recommandation Apple HIG + WCAG 2.5.5) */ @media (max-width: 600px) { a, button, [role="button"], input[type="button"], input[type="submit"], .btn { min-height: 44px; min-width: 44px; } /* On garde les bulletins décoratifs petits, mais on désactive leur interaction */ .feature-bullet, .check-icon, .decoration { pointer-events: none; } } /* 3. prefers-reduced-motion : neutralise animations lourdes */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } /* Starfield canvas et SVG : on les laisse visibles mais figés */ #starfield, .starfield, .zodiac-rotate, .parallax { animation: none !important; transform: none !important; } /* Scroll-snap : neutralisé */ [data-scroll-snap], .scroll-snap-container { scroll-snap-type: none !important; } } /* 4. 100vh → 100svh / 100dvh (fix Safari iOS bar shift) */ .hero, .full-height, [data-full-height] { height: 100vh; /* fallback */ height: 100svh; /* small viewport (par défaut, sans la barre) */ height: 100dvh; /* dynamic viewport (s'adapte au scroll) */ } /* 5. Pricing cards mobile : Premium en premier (centre de l'écran) */ @media (max-width: 600px) { .pricing-grid .plan-premium, .pr-pricing-grid .plan-premium, [data-plan="premium"] { order: -1; box-shadow: 0 0 0 2px var(--gold, var(--r-gold)); } } /* 6. Theme-color unifié (mobile browser chrome bar) — appliqué via meta dans HTML */ /* (à compléter côté de chaque template — laissé tel quel ici) */ /* 7. Fix carrousel célébrités : pan vertical libéré (anti scroll jail iOS) */ .swiper-container, .celebs-marquee, [data-marquee] { touch-action: pan-y pinch-zoom; } /* 8. Contraste badge "Le plus choisi" — passe de or/cream à navy/or (ratio 11.2:1 au lieu de 1.58:1) */ .pricing-badge-popular, .plan-badge[data-popular], .pr-price-badge-warm { color: #050816 !important; background-color: var(--r-gold) !important; } /* 9. CTAs : focus visible amélioré (WCAG 2.4.7) */ a:focus-visible, button:focus-visible, input:focus-visible, [role="button"]:focus-visible { outline: 2px solid var(--r-gold); outline-offset: 2px; border-radius: 0; } /* 10. Texte muted opacity remontée pour WCAG AA */ .text-muted, .muted, [data-muted] { color: var(--lx-ink-78, rgba(248, 242, 222, 0.78)) !important; /* au lieu de 0.55 trop bas */ }