:root{
  --ink:#0D0D0D;--white:#FFFFFF;--paper:#F5F4F1;--red:#C11C1C;--line:#E2E0DA;--muted:#88847C;--content:660px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--ink);font-family:"JetBrains Mono",monospace;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,.num{font-family:"Anton";font-weight:400;letter-spacing:0;line-height:.98}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* header */
.site-header{max-width:1180px;margin:auto;padding:24px 32px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--ink)}
.wordmark{font-family:"Anton";font-size:23px;letter-spacing:.01em}
.wordmark .dot{color:var(--red);margin:0 1px}
.main-nav{display:flex;gap:34px;font-size:12.5px;letter-spacing:.02em;text-transform:uppercase;font-weight:600}
.main-nav a{padding:4px 0;position:relative;color:var(--ink)}
.main-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--red);transition:right .25s ease}
.main-nav a:hover::after{right:0}
.main-nav a:hover{color:var(--red)}

/* menu mobile */
.nav-toggle{display:none;background:none;border:1px solid var(--ink);width:38px;height:38px;align-items:center;justify-content:center;cursor:pointer}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{content:"";display:block;width:16px;height:1.5px;background:var(--ink);position:relative}
.nav-toggle span::before{position:absolute;top:-5px}
.nav-toggle span::after{position:absolute;top:5px}
.mobile-nav{display:none;position:fixed;inset:0;background:#fff;z-index:300;padding:24px 32px;flex-direction:column}
.mobile-nav.open{display:flex}
.mobile-nav .mobile-nav-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--ink);padding-bottom:20px;margin-bottom:8px}
.mobile-nav a{font-family:"Anton";font-size:26px;padding:16px 0;border-bottom:1px solid var(--line)}
.mnav-close{border:1px solid var(--line);background:#fff;width:30px;height:30px;font-family:"JetBrains Mono";font-size:14px;cursor:pointer}

/* mission hero (home) */
.mission{max-width:900px;margin:auto;padding:56px 32px 74px;text-align:center;border-bottom:1px solid var(--line)}
.mission .eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--red);font-weight:700;display:inline-flex;align-items:center;gap:10px;margin-bottom:22px}
.mission .eyebrow::before{content:"";width:0;height:1px;background:var(--red);animation:grow .7s .15s ease forwards}
@keyframes grow{to{width:28px}}
.mission h1{font-size:clamp(32px,4.6vw,54px);margin:0 auto 24px;max-width:640px;line-height:1.08;opacity:0;transform:translateY(14px);animation:rise .6s .1s ease forwards}
.mission h1 .accent{color:var(--red)}
.mission p{font-size:15.5px;color:#332F29;max-width:560px;margin:0 auto 32px;line-height:1.7;opacity:0;transform:translateY(14px);animation:rise .6s .25s ease forwards}
.soon-hint{font-size:11.5px!important;color:var(--muted)!important;margin:0!important;text-transform:uppercase;letter-spacing:.03em}
.link-secondary{font-size:11.5px;letter-spacing:.03em;text-transform:none;font-weight:600;border-bottom:1px solid var(--ink);padding-bottom:1px;transition:color .18s ease,border-color .18s ease}
.link-secondary:hover{color:var(--red);border-color:var(--red)}
@keyframes rise{to{opacity:1;transform:translateY(0)}}

/* page générique (méthode, etc.) */
.page-header{max-width:var(--content);margin:auto;padding:64px 32px 40px}
.page-header .eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--red);font-weight:700;display:block;margin-bottom:18px}
.page-header h1{font-size:clamp(30px,4vw,44px);line-height:1.1;margin:0 0 16px}
.page-header p{font-size:15px;color:#332F29;margin:0;line-height:1.7}

.principles{max-width:var(--content);margin:auto;padding:20px 32px 20px}
.principle{display:grid;grid-template-columns:40px 1fr;gap:20px;padding:26px 0;border-top:1px solid var(--line)}
.principles .principle:last-child{border-bottom:1px solid var(--line)}
.principle .num{font-size:18px;color:var(--red)}
.principle h3{font-size:17px;margin:0 0 8px;font-family:"JetBrains Mono";font-weight:700}
.principle p{font-size:13.5px;color:#4A4640;margin:0;line-height:1.75}

.body-text{max-width:var(--content);margin:auto;padding:56px 32px 0}
.body-text h2,.body-text h3{font-size:20px;margin:0 0 16px}
.body-text h2::before,.body-text h3::before{content:"";display:block;width:34px;height:2px;background:var(--red);margin-bottom:16px}
.body-text p{font-size:14.5px;color:#211F1B;margin:0 0 20px;line-height:1.8}

.contact{max-width:var(--content);margin:20px auto 90px;padding:0 32px}
.contact-box{border:1px solid var(--ink);padding:26px}
.contact-box h3{font-family:"JetBrains Mono";font-weight:700;font-size:13px;margin:0 0 8px;text-transform:uppercase;letter-spacing:.02em}
.contact-box p{font-size:12.5px;color:var(--muted);margin:0}
.contact-box a{color:var(--red)}

/* breadcrumb (articles) */
.breadcrumb{max-width:var(--content);margin:auto;padding:28px 32px 0;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.breadcrumb a:hover{color:var(--red)}
.breadcrumb .sep{margin:0 8px;color:var(--line)}

/* article */
.art-header{max-width:var(--content);margin:auto;padding:22px 32px 36px}
.art-header .tag{font-size:11px;color:var(--red);text-transform:uppercase;letter-spacing:.08em;font-weight:700;display:block;margin-bottom:16px}
.art-header h1{font-size:clamp(28px,4vw,40px);line-height:1.12;margin:0 0 16px}
.art-header .deck{font-size:15px;color:#4A4640;margin:0 0 20px;line-height:1.65}
.art-meta{display:flex;gap:18px;font-size:11px;color:var(--muted)}

.art-body{max-width:var(--content);margin:auto;padding:0 32px}
.art-body p{font-size:15.5px;color:#211F1B;margin:0 0 22px;line-height:1.82}
.art-body h2{font-size:22px;margin:52px 0 20px}
.art-body h2::before{content:"";display:block;width:34px;height:2px;background:var(--red);margin-bottom:16px}
.art-body ul{margin:0 0 22px;padding-left:20px;font-size:15.5px;color:#211F1B;line-height:1.82}
.art-body ul li{margin-bottom:8px}

.inline-figure{margin:38px 0}
.inline-figure .frame{background:var(--paper);border:1px solid var(--line);min-height:260px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:12px;text-align:center;padding:20px}
.inline-figure figcaption{font-size:11px;color:var(--muted);margin-top:10px;display:flex;justify-content:space-between}

.inline-quote{margin:44px 0;border-left:2px solid var(--red);padding-left:24px}
.inline-quote p{font-family:"Anton";font-weight:400;font-size:22px;line-height:1.3;color:var(--ink);margin:0}
.inline-quote cite{display:block;font-family:"JetBrains Mono";font-style:normal;font-size:11px;color:var(--muted);margin-top:10px;text-transform:uppercase;letter-spacing:.04em}

.inline-table{margin:38px 0;border:1px solid var(--line);overflow-x:auto}
.inline-table table{width:100%;border-collapse:collapse;font-size:12.5px}
.inline-table th{text-align:left;background:var(--paper);padding:10px 14px;font-weight:600;border-bottom:1px solid var(--line);text-transform:uppercase;font-size:10.5px;letter-spacing:.03em;color:var(--muted)}
.inline-table td{padding:10px 14px;border-bottom:1px solid var(--line)}
.inline-table tr:last-child td{border-bottom:0}
.inline-table td.num{font-weight:600}
.inline-table caption{caption-side:bottom;text-align:left;font-size:11px;color:var(--muted);padding:10px 14px;font-style:normal}

.inline-stat{margin:44px 0;display:flex;align-items:baseline;gap:20px;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.inline-stat .num{font-size:52px;color:var(--red)}
.inline-stat p{font-size:12.5px;color:var(--muted);margin:0;line-height:1.6}

.art-sources{max-width:var(--content);margin:56px auto 0;padding:0 32px;border-top:1px solid var(--line);padding-top:40px}
.art-sources h2{font-size:16px;margin:0 0 16px;font-family:"JetBrains Mono";font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.art-sources ol{margin:0;padding-left:18px;font-size:12px;color:var(--muted);line-height:2}

.art-data{max-width:var(--content);margin:32px auto 0;padding:0 32px}
.data-box{border:1px solid var(--ink);padding:20px 24px;display:flex;justify-content:space-between;align-items:center;gap:16px}
.data-box h3{font-family:"JetBrains Mono";font-weight:600;font-size:12.5px;margin:0 0 4px}
.data-box p{font-size:11px;color:var(--muted);margin:0}
.data-btn{font-size:11px;text-transform:uppercase;letter-spacing:.03em;padding:11px 16px;border:1px solid var(--ink);font-weight:700;white-space:nowrap;background:#fff}
.data-btn:hover{background:var(--ink);color:#fff}

.related{max-width:var(--content);margin:56px auto 90px;padding:0 32px;border-top:1px solid var(--line);padding-top:36px}
.related h2{font-size:16px;margin:0 0 18px;font-family:"JetBrains Mono";font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.related-list a{display:block;padding:14px 0;border-top:1px solid var(--line);font-size:13.5px}
.related-list a:last-child{border-bottom:1px solid var(--line)}
.related-list a:hover{color:var(--red)}
.related-list .tag{color:var(--muted);font-size:10.5px;text-transform:uppercase;margin-right:10px}

/* newsletter pop-up */
.nl-overlay{position:fixed;inset:0;background:rgba(13,13,13,.55);display:flex;align-items:center;justify-content:center;padding:20px;z-index:200;opacity:0;pointer-events:none;transition:opacity .3s ease}
.nl-overlay.open{opacity:1;pointer-events:auto}
.nl-modal{background:#fff;max-width:420px;width:100%;padding:38px 34px;position:relative;transform:translateY(16px);transition:transform .3s ease}
.nl-overlay.open .nl-modal{transform:translateY(0)}
.nl-close{position:absolute;top:16px;right:16px;width:30px;height:30px;border:1px solid var(--line);background:#fff;font-family:"JetBrains Mono";font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .18s ease,color .18s ease}
.nl-close:hover{border-color:var(--red);color:var(--red)}
.nl-modal .eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--red);font-weight:700;display:block;margin-bottom:14px}
.nl-modal h3{font-family:"Anton";font-size:26px;margin:0 0 10px;line-height:1.05}
.nl-modal p{font-size:12.5px;color:#4A4640;margin:0 0 22px;line-height:1.6}
.nl-form{display:flex;flex-direction:column;gap:10px}
.nl-form input{border:1px solid var(--ink);padding:13px 14px;font-family:"JetBrains Mono";font-size:12.5px}
.nl-form button{border:0;background:var(--ink);color:#fff;padding:13px 14px;font-weight:700;font-size:11.5px;text-transform:uppercase;letter-spacing:.03em;cursor:pointer;transition:background .18s ease}
.nl-form button:hover{background:var(--red)}
.nl-fine{font-size:10px;color:var(--muted);margin-top:12px}

.site-footer{max-width:1180px;margin:auto;padding:28px 32px;border-top:1px solid var(--ink);display:flex;justify-content:space-between;font-size:10.5px;color:var(--muted)}

@media(max-width:860px){.main-nav{display:none}.nav-toggle{display:flex}}
@media(max-width:640px){.principle{grid-template-columns:1fr;gap:8px}.data-box{flex-direction:column;align-items:flex-start}}
