:root{
  --noir:#0A0A0A; --noir2:#161616; --rouge:#FF2B2B; --rouge-fonce:#D81F1F;
  --blanc:#FFFFFF; --gris:#BDBDBD; --gris2:#8A8A8A;
  --papier:#F5F2EC; --encre:#151515; --encre2:#4A4A4A; --filet:#DDD6CA;
  --titre:'Anton',Impact,'Arial Narrow',sans-serif;
  --mono:'Space Mono','Courier New',monospace;
  --nav:'Oswald','Arial Narrow',sans-serif;
  --texte:'EB Garamond',Garamond,Georgia,serif;
  --large:1120px; --etroit:720px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--noir);color:var(--blanc);font-family:var(--texte);font-size:20px;line-height:1.55;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--rouge);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* en-tête */
.entete{position:sticky;top:0;z-index:20;background:rgba(10,10,10,.94);backdrop-filter:blur(6px);border-bottom:1px solid #222}
.entete .in{max-width:var(--large);margin:0 auto;padding:0 20px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.logo{font-family:var(--titre);font-size:22px;letter-spacing:.02em;text-decoration:none;white-space:nowrap;line-height:1}
.logo span{color:var(--rouge)}
.menu{display:flex;gap:26px;font-family:var(--nav);font-size:15px;letter-spacing:.14em;text-transform:uppercase}
.menu a{text-decoration:none;color:var(--gris);padding:6px 0;border-bottom:2px solid transparent}
.menu a:hover,.menu a[aria-current=page]{color:var(--blanc);border-bottom-color:var(--rouge)}
@media (max-width:640px){
  .entete .in{height:auto;flex-direction:column;align-items:flex-start;gap:4px;padding:12px 16px 8px}
  .menu{gap:18px;font-size:13px}
  .logo{font-size:20px}
}

/* boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--titre);font-size:21px;letter-spacing:.03em;text-transform:uppercase;text-decoration:none;background:var(--rouge);color:var(--blanc);border:0;padding:16px 30px;cursor:pointer;line-height:1;transition:background .15s,transform .15s}
.btn:hover{background:var(--rouge-fonce)}
.btn:active{transform:translateY(1px)}
.btn.ligne{background:transparent;border:2px solid var(--blanc);padding:14px 28px}
.btn.ligne:hover{background:var(--blanc);color:var(--noir)}
.btn.sombre{background:var(--noir);color:var(--blanc)}
.btn.sombre:hover{background:#2a2a2a}
.boutons{display:flex;flex-wrap:wrap;gap:14px}

/* typographie */
.kicker{font-family:var(--mono);font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--rouge);margin:0 0 14px}
h1,h2,h3{font-family:var(--titre);font-weight:400;line-height:1.02;letter-spacing:.01em;margin:0}
.rouge{color:var(--rouge)}

/* accueil */
.hero{position:relative;max-width:var(--large);margin:0 auto;padding:72px 20px 84px}
.hero h1{font-size:clamp(60px,12.5vw,150px);text-transform:uppercase}
.hero h1 .ia{position:relative;color:var(--rouge);display:inline-block}
.rayures{background:repeating-linear-gradient(to bottom,transparent 0 .055em,var(--noir) .055em .07em);position:absolute;inset:0;pointer-events:none}
.hero .sous{font-family:var(--titre);font-size:clamp(24px,3.6vw,40px);line-height:1.12;text-transform:uppercase;margin:26px 0 0;max-width:820px}
.hero .sous .rouge{display:block}
.hero p.intro{font-size:22px;max-width:640px;color:#E4E4E4;margin:26px 0 34px}
.bande{background:var(--rouge);color:var(--blanc)}
.bande .in{max-width:var(--large);margin:0 auto;padding:22px 20px;font-family:var(--titre);font-size:clamp(22px,3.4vw,34px);text-transform:uppercase;letter-spacing:.02em;line-height:1.1}

.section{max-width:var(--large);margin:0 auto;padding:80px 20px}
.section h2{font-size:clamp(36px,5.5vw,60px);text-transform:uppercase;margin-bottom:22px}
.deux{display:grid;grid-template-columns:1fr 1fr;gap:28px}
@media (max-width:760px){.deux{grid-template-columns:1fr}}
.carte{background:var(--noir2);border:1px solid #262626;padding:32px;display:flex;flex-direction:column;gap:16px;text-decoration:none;transition:border-color .15s}
.carte:hover{border-color:var(--rouge)}
.carte h3{font-size:34px;text-transform:uppercase}
.carte p{margin:0;color:#D6D6D6}
.carte .fleche{font-family:var(--mono);font-size:15px;color:var(--rouge);margin-top:auto}

.livre-bloc{display:grid;grid-template-columns:minmax(220px,340px) 1fr;gap:56px;align-items:center}
.livre-bloc img{box-shadow:0 30px 60px rgba(0,0,0,.6),0 0 0 1px #222}
@media (max-width:760px){.livre-bloc{grid-template-columns:1fr;gap:32px}.livre-bloc img{max-width:280px}}
.livre-bloc .accroche{font-family:var(--titre);font-size:clamp(24px,3vw,32px);line-height:1.15;margin:0 0 18px}
.livre-bloc p{color:#DADADA}

/* pages papier */
.papier{background:var(--papier);color:var(--encre)}
.papier a{color:var(--rouge-fonce)}
.page-tete{background:var(--noir);color:var(--blanc)}
.page-tete .in{max-width:var(--etroit);margin:0 auto;padding:64px 20px 56px}
.page-tete h1{font-size:clamp(40px,6.4vw,68px);text-transform:uppercase}
.page-tete .chapo{font-size:22px;color:#E0E0E0;margin:22px 0 0}
.page-tete .meta{font-family:var(--mono);font-size:13px;color:var(--gris2);margin-top:22px;letter-spacing:.04em}
.corps{max-width:var(--etroit);margin:0 auto;padding:56px 20px 72px}
.corps p{margin:0 0 1.05em;hyphens:auto;-webkit-hyphens:auto}
.corps h2{font-size:clamp(28px,3.6vw,38px);text-transform:uppercase;margin:1.7em 0 .6em;color:var(--encre)}
.corps h3{font-size:24px;margin:1.4em 0 .5em}
.corps ul,.corps ol{padding-left:1.2em;margin:0 0 1.1em}
.corps li{margin:.35em 0}
.corps blockquote{margin:1.4em 0;padding:4px 0 4px 22px;border-left:4px solid var(--rouge);font-style:italic;color:var(--encre2)}
.corps .encadre{background:var(--noir);color:var(--blanc);padding:30px 30px 26px;margin:2em 0}
.corps .encadre p{margin:.4em 0 1em}
.corps .encadre a{color:var(--blanc)}
.corps .encadre .kicker{margin-bottom:6px}
.sources{border-top:1px solid var(--filet);margin-top:3em;padding-top:1.4em;font-size:16px;color:var(--encre2)}
.sources h2{font-size:22px;margin:0 0 .8em}
.sources li{margin:.45em 0}
.fin-article{margin-top:2.6em}

/* liste d'articles */
.liste{display:grid;gap:22px}
.liste a{display:block;text-decoration:none;color:var(--encre);background:#fff;border:1px solid var(--filet);padding:28px 30px;transition:border-color .15s}
.liste a:hover{border-color:var(--rouge)}
.liste h2{font-size:30px;text-transform:uppercase;margin:0 0 10px}
.liste p{margin:0;color:var(--encre2)}
.liste .kicker{margin-bottom:10px}

/* page livre */
.livre-tete{display:grid;grid-template-columns:300px 1fr;gap:48px;align-items:start;max-width:var(--large);margin:0 auto;padding:64px 20px}
@media (max-width:760px){.livre-tete{grid-template-columns:1fr}.livre-tete img{max-width:260px}}
.livre-tete h1{font-size:clamp(54px,8vw,96px)}
.livre-tete .st{font-family:var(--mono);font-size:17px;margin:14px 0 22px;color:#E6E6E6}
.prix{list-style:none;padding:0;margin:22px 0 28px;display:grid;gap:8px;font-family:var(--mono);font-size:15px}
.prix li{display:flex;justify-content:space-between;max-width:360px;border-bottom:1px solid #2a2a2a;padding:6px 0}
.sommaire{columns:2;column-gap:40px}
@media (max-width:760px){.sommaire{columns:1}}
.sommaire .partie{break-inside:avoid;margin-bottom:22px}
.sommaire h3{font-family:var(--mono);font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--rouge-fonce);margin:0 0 8px}
.sommaire ol{margin:0;padding-left:1.4em}

/* test */
.quiz{max-width:820px;margin:0 auto;padding:48px 20px 80px}
.quiz-tete{display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:14px;color:var(--gris);margin-bottom:12px}
.progression{height:4px;background:#262626;margin-bottom:34px}
.progression div{height:100%;background:var(--rouge);width:0;transition:width .3s}
.extrait{background:var(--papier);color:var(--encre);padding:40px 42px;font-size:24px;line-height:1.5;min-height:180px;display:flex;align-items:center;position:relative}
.extrait::before{content:"\201C";position:absolute;top:8px;left:14px;font-family:var(--titre);font-size:90px;color:var(--rouge);line-height:1}
.extrait .t{width:100%}
.extrait .vers{white-space:pre-line}
@media (max-width:600px){.extrait{padding:34px 22px 26px;font-size:21px}}
.question{font-family:var(--titre);font-size:clamp(26px,4vw,38px);text-transform:uppercase;margin:32px 0 18px;text-align:center}
.choix{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.choix button{font-family:var(--titre);font-size:clamp(22px,3.4vw,30px);text-transform:uppercase;padding:22px 10px;border:2px solid var(--blanc);background:transparent;color:var(--blanc);cursor:pointer;transition:all .15s}
.choix button:hover:not(:disabled){background:var(--blanc);color:var(--noir)}
.choix button.machine{border-color:var(--rouge);color:var(--rouge)}
.choix button.machine:hover:not(:disabled){background:var(--rouge);color:var(--blanc)}
.choix button:disabled{opacity:.35;cursor:default}
.choix button.pris{opacity:1}
.verdict{margin-top:26px;padding:26px 28px;border-left:6px solid var(--rouge);background:var(--noir2)}
.verdict .v{font-family:var(--titre);font-size:30px;text-transform:uppercase;margin:0 0 8px}
.verdict .v.ok{color:#5BD08A}
.verdict .v.ko{color:var(--rouge)}
.verdict .src{font-family:var(--mono);font-size:15px;color:var(--gris);margin:0 0 10px}
.verdict p{margin:0 0 12px;color:#E2E2E2}
.verdict .btn{margin-top:8px}
.score{text-align:center}
.score .grand{font-family:var(--titre);font-size:clamp(90px,20vw,180px);line-height:1;color:var(--rouge)}
.score .grand small{font-size:.4em;color:var(--blanc)}
.score h2{font-size:clamp(30px,4.6vw,46px);text-transform:uppercase;margin:12px 0 18px}
.score p{max-width:620px;margin:0 auto 18px;color:#E2E2E2}
.score .boutons{justify-content:center;margin-top:26px}
.recap{list-style:none;padding:0;margin:40px auto 0;max-width:640px;text-align:left;font-size:17px}
.recap li{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid #262626;align-items:baseline}
.recap .m{font-family:var(--mono);font-size:14px;min-width:24px}
.recap .m.ok{color:#5BD08A}
.recap .m.ko{color:var(--rouge)}
.partage{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.partage a,.partage button{font-family:var(--mono);font-size:14px;color:var(--blanc);background:#222;border:0;padding:10px 16px;text-decoration:none;cursor:pointer}
.partage a:hover,.partage button:hover{background:#333}
.pub-livre{margin-top:56px;border-top:1px solid #262626;padding-top:44px;display:grid;grid-template-columns:150px 1fr;gap:28px;align-items:center;text-align:left}
@media (max-width:560px){.pub-livre{grid-template-columns:1fr}.pub-livre img{max-width:150px}}
.pub-livre p{margin:0 0 14px}

/* paranoIA */
.checklist{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.checklist label{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid var(--filet);padding:16px 18px;cursor:pointer;font-size:20px;line-height:1.35}
.checklist input{width:22px;height:22px;accent-color:var(--rouge);flex:none;margin-top:3px}
.checklist label:has(input:checked){border-color:var(--rouge);background:#FFF4F2}
.resultat{display:none;margin-top:28px}
.resultat.on{display:block}

/* pied de page */
.pied{border-top:1px solid #222;background:var(--noir)}
.pied .in{max-width:var(--large);margin:0 auto;padding:36px 20px;display:flex;flex-wrap:wrap;gap:14px 30px;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:13px;color:var(--gris2)}
.pied a{color:var(--gris);text-decoration:none}
.pied a:hover{color:var(--blanc)}
.pied nav{display:flex;flex-wrap:wrap;gap:20px}