@font-face{font-family:Jost;src:url(media/Jost-Variable.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:JostBlack;src:url(media/Jost-Black.ttf) format("truetype");font-weight:900;font-display:swap}
:root{--fond:#0D1030;--panneau:#1D2140;--panneau2:#33374F;--texte:#F3EFE6;--discret:#A9ABC4;--accent:#FF5A1F;--marque:#1C2FB5;--lien:#718FE1;--r:12px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;background:var(--fond);color:var(--texte);font:17px/1.55 Jost,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
img{max-width:100%}a{color:var(--lien)}:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.aller{position:absolute;left:-999px}.aller:focus{left:16px;top:8px;z-index:10;background:var(--accent);color:var(--fond);padding:8px 12px}
main{max-width:1120px;margin:0 auto;padding:0 16px 48px}
h1,h2,.titre-bloc{font-family:JostBlack,Jost,sans-serif;font-weight:900;text-transform:uppercase;line-height:1.02;letter-spacing:.005em;text-wrap:balance}
h2{font-size:30px;margin:56px 0 16px}
.haut{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:10px 16px;padding-top:max(10px,env(safe-area-inset-top));background:color-mix(in srgb,var(--fond) 88%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--panneau)}
.logo img{height:26px;width:auto;display:block}.haut nav{display:flex;align-items:center;gap:20px}.haut nav a.large{display:none;color:var(--texte);text-decoration:none;font-weight:600}.haut nav a.large:hover{color:var(--accent)}
.bouton{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border:2px solid var(--texte);border-radius:999px;background:none;color:var(--texte);font:inherit;font-weight:700;text-decoration:none;cursor:pointer}
.bouton svg{width:20px;height:20px;flex:none}.bouton:hover{border-color:var(--accent);color:var(--accent)}
.bouton.petit{min-height:38px;padding:0 14px;font-size:15px}.bouton.petit svg{width:17px;height:17px}
.bouton.plein{background:var(--accent);border-color:var(--accent);color:var(--fond)}.bouton.plein:hover{background:var(--texte);border-color:var(--texte);color:var(--fond)}
.badge{display:inline-block;align-self:flex-start;background:var(--accent);color:var(--fond);font-size:11px;font-weight:800;letter-spacing:.06em;padding:3px 8px;border-radius:4px;text-transform:uppercase;margin-bottom:6px}
.date{display:block;text-transform:uppercase;font-size:12px;letter-spacing:.1em;color:var(--discret);margin:0 0 4px}
.accroche{padding:28px 0 24px}.accroche h1{font-size:clamp(40px,11vw,96px);color:var(--accent);margin:0 0 12px}.accroche p{color:var(--discret);margin:0;max-width:600px;font-size:18px}
.carte{display:flex;flex-direction:column;border-radius:var(--r);overflow:hidden;background:var(--panneau);color:var(--texte);text-decoration:none;transition:transform .2s,box-shadow .2s}
.carte:hover{transform:translateY(-3px);box-shadow:0 0 0 2px var(--accent)}
.carte .image{display:block;aspect-ratio:4/5;background:var(--marque);overflow:hidden}.carte img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.carte .texte{display:flex;flex-direction:column;padding:14px 16px 18px}
.carte .titre{font-weight:700;font-size:21px;line-height:1.2}.carte .angle{color:var(--discret);margin-top:8px}.carte .suite{color:var(--accent);font-weight:700;font-size:15px;margin-top:10px}
.carte.une .titre{font-family:JostBlack,Jost,sans-serif;text-transform:uppercase;font-size:clamp(26px,6vw,40px);line-height:1.05}
.grille{display:grid;grid-template-columns:1fr;gap:16px;margin-top:16px}
.qui p{max-width:680px;font-size:18px}
.methode{list-style:none;padding:0;margin:0;display:grid;gap:12px;counter-reset:m}
.methode li{background:var(--panneau);border-radius:var(--r);padding:16px 18px 18px;counter-increment:m}
.methode li::before{content:"0" counter(m);font-family:JostBlack,Jost,sans-serif;color:var(--accent);font-size:15px}
.methode h3{margin:4px 0 6px;font-size:19px}.methode p{margin:0;color:var(--discret)}
.reseaux.boutons{display:flex;flex-direction:column;gap:10px}
.reseaux.icones{display:flex;gap:6px}.reseaux.icones a{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--texte);background:var(--panneau)}.reseaux.icones a:hover{color:var(--fond);background:var(--accent)}.reseaux.icones svg{width:20px;height:20px}
.sujet .tete{display:flex;flex-direction:column;gap:20px;padding-top:16px}
.media{margin:0 auto;width:100%;max-width:400px}.media figcaption{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:12px}
.video{position:relative;display:block;width:100%;aspect-ratio:16/9;padding:0;border:0;border-radius:var(--r);overflow:hidden;background:var(--panneau);cursor:pointer}
.video.vertical{aspect-ratio:9/16;width:auto;height:min(74svh,700px);margin:0 auto}.video img{width:100%;height:100%;object-fit:cover}.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lecture{position:absolute;inset:0;display:grid;place-items:center;color:var(--accent);background:linear-gradient(transparent 60%,rgba(13,16,48,.5))}.lecture svg{width:76px;height:76px;filter:drop-shadow(0 4px 16px rgba(0,0,0,.5));transition:transform .2s}.video:hover .lecture svg{transform:scale(1.08)}
.ecran-sensible{position:relative;display:block;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;background:var(--panneau);color:var(--texte);text-decoration:none}
.ecran-sensible img{width:100%;height:100%;object-fit:cover;filter:blur(28px) brightness(.55);transform:scale(1.15)}
.ecran-sensible .avertissement{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px;text-align:center}
.ecran-sensible strong{font-family:JostBlack,Jost,sans-serif;text-transform:uppercase;font-size:24px}.ecran-sensible .bouton{margin-top:8px}
.instagram-media{min-width:0!important;width:100%!important;margin:0!important;border-radius:var(--r)!important}.couverture{display:block;width:100%;border-radius:var(--r)}
.sujet h1{font-size:clamp(30px,8vw,52px);color:var(--accent);margin:2px 0 12px}.chapeau{font-size:19px;margin:0}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 0}
.page-sources{max-width:760px;margin:24px auto 0}.page-sources .intro{color:var(--discret)}
.chapitre h3{position:sticky;top:52px;z-index:1;margin:28px 0 8px;padding:8px 0;background:var(--fond);color:var(--accent);font-size:15px;letter-spacing:.1em;text-transform:uppercase}
.sources{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.sources li{background:var(--panneau);border-radius:var(--r);padding:14px 16px;overflow-wrap:anywhere}
.sources .qui{margin:0;font-size:14px;color:var(--discret);text-transform:uppercase;letter-spacing:.04em}.sources .qui strong{color:var(--texte)}
.sources .quoi{margin:4px 0 0;font-weight:600;line-height:1.35}
.sources blockquote{margin:12px 0 0;padding:10px 14px;border-left:3px solid var(--accent);background:var(--fond);border-radius:0 8px 8px 0;font-size:16px;line-height:1.5}
.sources .liens{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 0}.sources .liens a{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:999px;background:var(--panneau2);color:var(--texte);text-decoration:none;font-weight:600;font-size:15px}.sources .liens a:hover{background:var(--accent);color:var(--fond)}.sources .liens span{color:var(--discret);font-size:14px}
.retour{max-width:760px;margin:40px auto 0}.retour a{color:var(--texte);font-weight:700;text-decoration:none}
footer{display:flex;flex-direction:column;gap:16px;border-top:1px solid var(--panneau);padding:28px 16px calc(40px + env(safe-area-inset-bottom));max-width:1120px;margin:0 auto;color:var(--discret);font-size:15px}footer p{margin:0;max-width:560px}footer img{width:140px;height:auto}
.liens main{max-width:480px;padding-top:max(36px,env(safe-area-inset-top));text-align:center}.liens .avatar{border-radius:50%}
.liens h1{font-size:30px;margin:12px 0 0}.liens .devise{font-family:JostBlack,Jost,sans-serif;text-transform:uppercase;color:var(--accent);margin:4px 0 24px}
.liens h2{font-size:14px;letter-spacing:.08em;color:var(--discret);margin:32px 0 12px}
.lien-sujet{display:flex;gap:14px;align-items:center;text-align:left;padding:8px 14px 8px 8px;margin-bottom:10px;border-radius:var(--r);background:var(--panneau);color:var(--texte);text-decoration:none;font-weight:600;line-height:1.25}.lien-sujet:hover{box-shadow:0 0 0 2px var(--accent)}
.lien-sujet span{display:flex;flex-direction:column}.lien-sujet img{width:56px;height:70px;object-fit:cover;object-position:top;border-radius:8px;flex:none}.liens .bouton.plein{width:100%;margin-top:14px}
@media (min-width:640px){.grille{grid-template-columns:1fr 1fr}.methode{grid-template-columns:1fr 1fr}.reseaux.boutons{flex-direction:row;flex-wrap:wrap}.liens .reseaux.boutons{flex-direction:column}
.carte.une{flex-direction:row}.carte.une .image{flex:0 0 46%}.carte.une .texte{justify-content:center;padding:28px}}
@media (min-width:1000px){main{padding:0 24px 72px}.haut{padding:14px 24px}.logo img{height:32px}.haut nav a.large{display:inline}
.grille{grid-template-columns:repeat(3,1fr);gap:24px;margin-top:24px}.methode{grid-template-columns:repeat(4,1fr)}
.sujet .tete{flex-direction:row;align-items:flex-start;gap:48px;padding-top:40px}.sujet .tete .texte{position:sticky;top:96px}.sujet .tete .media{flex:0 0 380px;margin:0}.sujet .tete .texte{flex:1}
footer{flex-direction:row;align-items:center;justify-content:space-between;padding:32px 24px 48px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}