/* ElityX vitrine, aux couleurs de marque (bleu / indigo). Une seule feuille de style, thème clair/sombre via prefers-color-scheme. Polices système, mobile-first. */ :root { --brand: #1565c0; /* bleu primaire ElityX */ --brand-dark: #0d47a1; --brand-accent: #2563eb; --brand-soft: #e3f2fd; --bg: #ffffff; --bg-alt: #f4f7fb; --card: #ffffff; --text: #16202e; --muted: #5b6675; --border: #e3e8ef; --shadow: 0 1px 3px rgba(13,71,161,.06), 0 8px 24px rgba(13,71,161,.05); --radius: 14px; --maxw: 1080px; } /* Thème clair par défaut. Le sombre s'active manuellement via data-theme="dark" sur (bouton dans le header, choix mémorisé en localStorage). */ :root[data-theme="dark"] { --brand: #5fa8f5; --brand-dark: #2196f3; --brand-accent: #6ea8fe; --brand-soft: #102337; --bg: #0d141f; --bg-alt: #111a27; --card: #16202e; --text: #e6edf6; --muted: #9fb0c4; --border: #243246; --shadow: 0 1px 3px rgba(0,0,0,.4), 0 10px 28px rgba(0,0,0,.35); } * { box-sizing: border-box; } html { scroll-behavior: smooth; } body { margin: 0; font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; color: var(--text); background: var(--bg); line-height: 1.6; -webkit-font-smoothing: antialiased; } .wrap { max-width: var(--maxw); margin: 0 auto; padding-inline: 20px; } a { color: var(--brand-dark); text-underline-offset: 2px; } :root[data-theme="dark"] a { color: var(--brand); } img, svg { max-width: 100%; height: auto; } h1, h2, h3 { line-height: 1.2; letter-spacing: -.01em; } .visually-hidden, .skip { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } .skip:focus { position: fixed; top: 8px; left: 8px; width: auto; height: auto; clip: auto; background: var(--brand); color: #fff; padding: 8px 14px; border-radius: 8px; z-index: 100; } /* ---------- Boutons ---------- */ .btn { /* Neutralise le rendu natif du