:root{--paper: #f1ede1;--ivory: #f7f4ea;--vellum: #e4ddc9;--vellum-2: #d9d2bc;--ink: #1e1a14;--ink-2: #2d2820;--red: #a8332b;--red-dk: #7e2620;--red-soft: rgba(168, 51, 43, .08);--red-border: rgba(168, 51, 43, .22);--ochre: #b8834e;--ochre-dk: #8f6537;--stone: #8b8377;--stone-dk: #4a4740;--line: #c9c2b0;--line-dk: #2a2620;--bg-base: var(--paper);--bg-alt: var(--vellum);--bg-dark: var(--ink);--surface-card: var(--paper);--surface-hover: var(--ivory);--text-strong: var(--ink);--text-body: var(--ink-2);--text-muted: var(--stone-dk);--text-faint: var(--stone);--text-on-dark: var(--paper);--accent: var(--red);--accent-press: var(--red-dk);--accent-2: var(--ochre);--rule: var(--line);--rule-strong: var(--ink);--rule-on-dark: var(--paper);--font-h: "Bricolage Grotesque", system-ui, sans-serif;--font-b: "Work Sans", system-ui, sans-serif;--font-m: "JetBrains Mono", "SF Mono", Menlo, monospace;--font-s: "Instrument Serif", Georgia, serif;--w-regular: 400;--w-medium: 500;--w-semibold: 600;--w-bold: 700;--w-extrabold: 800;--t-h1: clamp(48px, 8vw, 116px);--t-h2: clamp(34px, 5vw, 60px);--t-h3: clamp(22px, 2.4vw, 32px);--t-h4: 17px;--t-lead: clamp(18px, 1.8vw, 22px);--t-body: 16.5px;--t-body-sm: 14.5px;--t-caption: 13px;--t-folio: 11px;--t-eyebrow: 11px;--t-micro: 10.5px;--lh-display: .98;--lh-tight: 1.15;--lh-snug: 1.35;--lh-body: 1.55;--lh-relaxed: 1.65;--ls-display: -.035em;--ls-h2: -.03em;--ls-h3: -.025em;--ls-tight: -.015em;--ls-body: -.005em;--ls-folio: .14em;--ls-eyebrow: .2em;--ls-label: .18em;--sp-1: .25rem;--sp-2: .5rem;--sp-3: .75rem;--sp-4: 1rem;--sp-5: 1.5rem;--sp-6: 2rem;--sp-7: 2.75rem;--sp-8: 4rem;--sp-9: 6rem;--sp-10: 7.75rem;--bw-hair: 1px;--bw-rule: 1.5px;--bw-bold: 2.5px;--bw-heavy: 3px;--r-none: 0;--r-xs: 2px;--r-sm: 3px;--shadow-card: 0 1px 0 rgba(30, 26, 20, .04);--shadow-pop: 0 18px 50px -22px rgba(30, 26, 20, .35);--ring: 0 0 0 3px rgba(168, 51, 43, .3);--max: 1280px;--max-sm: 1020px;--pad: 36px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{background:var(--paper);color:var(--ink);font-family:var(--font-b);font-size:var(--t-body);line-height:var(--lh-body);-webkit-font-smoothing:antialiased}::selection{background:var(--red);color:var(--paper)}h1,h2{font-family:var(--font-h);color:var(--ink);letter-spacing:-.025em;line-height:1.05;font-weight:500}h1{font-size:clamp(32px,5vw,56px);letter-spacing:-.03em;max-width:18ch}p{margin:0}a{color:inherit;text-decoration:none;transition:opacity .12s,color .12s}em{font-style:italic;color:var(--red)}.wrap{max-width:720px;margin:0 auto;padding:0 24px}.skip-link{position:absolute;left:-9999px;top:0;z-index:2000;background:var(--ink);color:var(--paper);font-family:var(--font-b);font-size:14px;padding:10px 16px}.skip-link:focus{left:8px;top:8px}.nav{position:sticky;top:0;z-index:50;background:#f1ede1eb;-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid var(--line)}.nav-inner{display:flex;align-items:center;justify-content:space-between;height:70px;max-width:720px;margin:0 auto;padding:0 24px}.brand{font-family:var(--font-h);font-size:20px;font-weight:600;letter-spacing:-.03em;display:inline-flex;align-items:center;gap:10px}.brand .dot{width:7px;height:7px;background:var(--red);border-radius:50%}.back{font-family:var(--font-b);font-size:13.5px;font-weight:500;border-bottom:1.5px solid var(--ink);padding-bottom:3px}.back:hover{color:var(--red);border-bottom-color:var(--red)}.diag{padding:0 0 96px;min-height:70vh}.diag-progress{position:sticky;top:70px;z-index:20;display:flex;align-items:center;gap:16px;padding:18px 0 16px;background:#f1ede1eb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.diag-progress .bar{flex:1;height:4px;background:var(--line);border-radius:2px;overflow:hidden}.diag-progress .bar span{display:block;height:100%;width:4%;background:var(--red);border-radius:2px;transition:width .35s ease}.diag-progress .count{font-family:var(--font-m);font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--ink-2);white-space:nowrap}.step{opacity:0;transform:translateY(10px);transition:opacity .3s ease,transform .3s ease}.step.is-active{opacity:1;transform:none}.step[hidden]{display:none}.intro{padding:64px 0 40px}.eyebrow{font-family:var(--font-m);font-size:11px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:28px;display:inline-flex;align-items:center;gap:14px}.eyebrow:before{content:"";width:28px;height:1.5px;background:var(--red)}.intro .lead{font-size:clamp(16px,1.6vw,19px);color:var(--ink-2);max-width:52ch;margin:24px 0 32px;line-height:1.5}.intro .reassure{font-size:13px;color:var(--stone-dk);margin-top:18px;max-width:48ch}.q-step{padding:32px 0 0}.q-card{opacity:0;transition:opacity .3s ease,transform .42s cubic-bezier(.22,.61,.36,1)}.q-card.is-pre{opacity:0;transform:translate(52px);transition:none}.q-card.is-in{opacity:1;transform:none}.q-card.is-out{opacity:0;transform:translate(-52px);transition:opacity .24s ease,transform .26s ease}.q-cat{font-family:var(--font-m);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--red);font-weight:600;display:block;margin-bottom:18px}.q-text{font-family:var(--font-h);font-weight:500;font-size:clamp(22px,3.4vw,30px);line-height:1.22;letter-spacing:-.02em;margin-bottom:32px;max-width:none}.q-opts{display:grid;gap:12px;max-width:460px}.q-opt{display:flex;align-items:center;gap:16px;width:100%;min-height:62px;padding:16px 22px;font-family:var(--font-b);font-size:16px;font-weight:500;text-align:left;color:var(--ink);background:var(--ivory);border:1.5px solid var(--line);cursor:pointer;transition:all .12s}.q-opt:hover{border-color:var(--ink);transform:translate(2px)}.q-opt .dot{flex:none;width:20px;height:20px;border-radius:50%;border:2px solid var(--stone-dk);transition:all .12s}.q-opt.sel{border-color:var(--red);background:var(--paper)}.q-opt.sel .dot{background:var(--red);border-color:var(--red);box-shadow:inset 0 0 0 3px var(--paper)}.q-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:36px;border-top:1px solid var(--line);padding-top:20px}.ghost{font-family:var(--font-b);font-size:14px;font-weight:500;color:var(--ink-2);background:none;border:none;cursor:pointer;padding:6px 0}.ghost:hover{color:var(--red)}.q-foot .hint{font-size:12.5px;color:var(--stone-dk)}.contact{padding:48px 0 0}.contact .tag{font-family:var(--font-m);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--red);font-weight:600;display:block;margin-bottom:14px}.contact h2{font-size:clamp(26px,3.5vw,38px);margin-bottom:14px}.contact-intro{font-size:15px;color:var(--ink-2);margin-bottom:24px;line-height:1.5;max-width:52ch}.who-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}.contact input{font-family:var(--font-b);font-size:15.5px;padding:15px 16px;border:1.5px solid var(--line);background:var(--paper);color:var(--ink);width:100%}.contact input[name=email]{margin-bottom:18px}.contact input:focus{border-color:var(--red)}.legal{font-size:11.5px;color:var(--stone-dk);margin-top:14px;line-height:1.5}.legal a{border-bottom:1px solid var(--line)}.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 28px;font-family:var(--font-b);font-weight:500;font-size:15px;cursor:pointer;border:1.5px solid var(--ink);background:var(--ink);color:var(--paper);transition:all .15s}.btn:hover{background:var(--red);border-color:var(--red)}.btn[disabled]{opacity:.5;cursor:default}.err{display:none;margin-top:14px;font-size:14px;color:var(--red);font-weight:500}.result{margin-top:48px;padding:40px 36px;border:2px solid var(--ink);background:var(--paper);position:relative}.result:before{content:"";position:absolute;top:-2px;left:-2px;right:-2px;height:6px;background:var(--red)}.result .score{font-family:var(--font-h);font-size:clamp(44px,6vw,68px);font-weight:500;letter-spacing:-.04em;color:var(--red);line-height:1;margin-bottom:16px}.result .score .den{font-size:.42em;color:var(--stone-dk)}.result h2{font-size:clamp(24px,3vw,34px);margin-bottom:16px}.result p{font-size:15.5px;line-height:1.6;color:var(--ink-2);margin-bottom:14px;max-width:60ch}.result p strong{font-weight:600;color:var(--ink)}.result .btn{margin-top:10px}@media (max-width: 640px){.who-fields{grid-template-columns:1fr}.intro{padding:40px 0 32px}.q-foot .hint{display:none}.result{padding:32px 24px}}

/* ═══ passe accessibilité S31 · 2026-07-27 ═══════════════════
   Aucune couleur de la palette n'est modifiée : on ne fait que
   choisir, parmi les tokens existants, celui qui atteint le seuil.
   ─────────────────────────────────────────────────────────── */

/* 2.4.7 Focus visible — un anneau au clavier, invisible à la souris. */
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
a:focus-visible,button:focus-visible,summary:focus-visible,
[role=button]:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--ink);outline-offset:3px;border-radius:var(--r-xs)}
input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid var(--red-dk);outline-offset:1px}
.on-dark :focus-visible,.dark :focus-visible,
section[class*=dark] :focus-visible,footer :focus-visible{
  outline-color:var(--paper)}

/* 1.4.1 + 1.4.11 Liens en pleine prose : soulignés, donc repérables
   sans dépendre de la seule couleur. Les liens de navigation, les
   boutons et les cartes gardent leur traitement d'origine. */
main p > a:not(.btn):not(.card):not([class*=cta]),
main li > a:not(.btn):not(.card):not([class*=cta]),
main dd > a:not(.btn):not(.card):not([class*=cta]),
.legal a:not(.btn),.note a:not(.btn),
figcaption a:not(.btn),blockquote a:not(.btn){
  text-decoration:underline;text-underline-offset:.18em;
  text-decoration-thickness:from-font}
main p > a:not(.btn):not(.card):not([class*=cta]):hover,
main li > a:not(.btn):not(.card):not([class*=cta]):hover{
  text-decoration-thickness:2px}

/* Utilitaire : lisible par un lecteur d'écran, invisible à l'œil. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* 2.3.3 Respect de « réduire les animations » (réglage système). */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;
    animation-iteration-count:1 !important;transition-duration:.01ms !important;
    scroll-behavior:auto !important}
}