@import url("blog.css");
/* ARTICLE — gabarit commun aux articles du blog (24/10/2026). La matière du pôle en tête, une barre de lecture
   qui se remplit en haut de l'écran, un sommaire collé à côté du texte. Préfixe ar-. */
.ar{--pole:var(--article)}
.ar-progression{position:fixed;left:0;top:0;z-index:600;height:3px;width:100%;background:var(--article);transform:scaleX(var(--lu,0));transform-origin:left;pointer-events:none}
.ar-tete{position:relative;isolation:isolate;overflow:hidden;padding:clamp(120px,14vh,180px) 0 clamp(56px,7vh,96px);border-bottom:1px solid var(--w-filet)}
.ar-tete__matiere{position:absolute;inset:0;z-index:-1;opacity:.6}
.ar-tete__matiere canvas{width:100%;height:100%}
.ar-tete__matiere::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0A0B0E 25%,rgba(10,11,14,.55) 70%,rgba(10,11,14,.85)),linear-gradient(180deg,transparent 60%,#0A0B0E)}
.ar-retour{display:flex;width:fit-content;gap:8px;margin-bottom:28px;font-size:14px;font-weight:500;color:var(--w-gris);text-decoration:none}
.ar-retour:hover{color:var(--w-blanc)}
.ar-tete .pastille::before{background:var(--article)}
.ar-titre{margin:18px 0 22px;max-width:20ch;font-size:clamp(40px,4.6vw,80px);font-weight:700;letter-spacing:-.04em;line-height:1.04;color:#F7FAFF}
.ar-chapeau{margin:0 0 32px;max-width:58ch;font-size:clamp(18px,1.45vw,23px);line-height:1.55;color:#C9CED8}
.ar-auteur{display:flex;align-items:center;gap:14px;margin:0}
.ar-auteur img{width:44px;height:44px;border-radius:50%;object-fit:cover}
.ar-auteur > span{display:flex;flex-direction:column;gap:2px;font-size:14px;color:var(--w-gris)}
.ar-auteur strong{color:var(--w-blanc);font-weight:600}
.ar-grille{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,8fr);gap:clamp(32px,5vw,96px);padding-top:clamp(56px,7vw,104px);padding-bottom:clamp(40px,5vw,72px)}
.ar-sommaire{position:sticky;top:clamp(80px,12vh,140px);align-self:start}
.ar-sommaire p{margin:0 0 14px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--w-gris-doux)}
.ar-sommaire ol{list-style:none;margin:0;padding:0;border-left:1px solid var(--w-filet)}
.ar-sommaire a{display:block;padding:8px 0 8px 16px;margin-left:-1px;border-left:1px solid transparent;font-size:14.5px;line-height:1.4;color:var(--w-gris);text-decoration:none;transition:color .3s,border-color .3s}
.ar-sommaire a:hover,.ar-sommaire a.est-actif{color:var(--w-blanc);border-left-color:var(--article)}
.ar-corps{max-width:68ch}
.ar-corps h2{margin:56px 0 18px;font-size:clamp(26px,2.2vw,36px);font-weight:600;letter-spacing:-.025em;line-height:1.15;scroll-margin-top:100px}
.ar-corps h2:first-child{margin-top:0}
.ar-corps p{margin:0 0 20px;font-size:clamp(17px,1.25vw,19.5px);line-height:1.75;color:#C9CED8}
.ar-corps a{color:#F7FAFF;text-decoration:underline;text-decoration-color:var(--article);text-underline-offset:4px}
.ar-corps em{color:#F7FAFF}
.b-grille--deux{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:900px){.ar-grille{grid-template-columns:1fr}.ar-sommaire{position:static}}
.ar-tete .pastille{border:0;background:none;padding:0;box-shadow:none}