/* =====================================================================
   Amerikin Magazine · page article (s'ajoute à amerikin.css)
   Colonne de lecture de 680 px ; photo, encadrés et graphiques élargis à 920 px.
   ===================================================================== */
body{overflow-x:clip}
.progression{position:absolute;left:0;top:100%;height:3px;width:0;background:var(--or);pointer-events:none}

.article{padding:0 var(--gouttiere)}
.col{max-width:680px;margin-inline:auto}
.large{width:min(920px,calc(100vw - 32px));margin-left:50%!important;margin-right:0!important;transform:translateX(-50%)}

.fil{display:flex;flex-wrap:wrap;gap:6px 10px;font:500 12.5px/1 var(--texte);color:var(--gris);margin-bottom:22px}
.fil a{text-decoration:none}
.fil a:hover{text-decoration:underline;text-decoration-color:var(--or);text-underline-offset:4px}
.fil span[aria-hidden]{color:#b0b8c3}
.article h1{font:700 clamp(32px,4.6vw,50px)/1.08 var(--titre);color:var(--nuit);margin:14px 0 18px;letter-spacing:-.005em}
.article .chapo{font:400 21px/1.5 var(--titre);color:#3a4552;max-width:none}

.signature-article{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 20px;margin-top:26px;padding-block:16px;border-top:1px solid var(--filet);border-bottom:1px solid var(--filet)}
.auteur{display:flex;align-items:center;gap:12px}
.monogramme{width:44px;height:44px;border-radius:50%;background:var(--nuit);color:var(--or);display:grid;place-items:center;font:700 17px/1 var(--titre);flex:none;overflow:hidden}
.monogramme img{width:100%;height:100%;object-fit:cover}
.auteur b{display:block;font:500 15px/1.3 var(--texte);color:var(--nuit)}
.auteur small{display:block;font-size:13px;color:var(--gris)}
.partage{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.partage a,.partage button{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--filet);border-radius:2px;background:#fff;color:var(--nuit);cursor:pointer;text-decoration:none}
.partage a:hover,.partage button:hover{border-color:var(--nuit)}
.partage svg{width:16px;height:16px}
.copie-ok{font-size:12.5px;color:#1d7a4c}

.photo-une{margin:36px 0 0}
.photo-une .cadre{aspect-ratio:16/9;overflow:hidden;background:var(--nuit)}
.photo-une img{width:100%;height:100%;object-fit:cover;object-position:50% 25%}
figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 16px;padding:10px 0;font-size:13px;color:var(--gris);border-bottom:1px solid var(--filet)}
figcaption span{font-size:12px;letter-spacing:.06em;text-transform:uppercase}

/* Corps du texte */
.texte{margin-top:40px;font:400 18.5px/1.75 var(--texte);color:#1f2833}
.texte>*{margin-block:0}
.texte>*+*{margin-top:1.15em}
.texte>p:first-of-type::first-letter{float:left;font:700 4.4em/.82 var(--titre);color:var(--nuit);margin:.08em .1em 0 0}
.texte h2{font:700 27px/1.25 var(--titre);color:var(--nuit);margin-top:1.9em}
.texte h3{font:700 21px/1.3 var(--titre);color:var(--nuit);margin-top:1.5em}
.texte a{text-decoration-color:var(--or);text-decoration-thickness:2px;text-underline-offset:4px}
.texte strong{font-weight:500;color:var(--nuit)}
.texte ul,.texte ol{margin:0;padding-left:1.2em}
.texte li+li{margin-top:.45em}
.texte li::marker{color:var(--or-texte)}
.texte .amk-mur{margin-top:2em}

.photo-corps{margin:2em 0}
.photo-corps img{width:100%;height:auto;border-radius:2px}

.exergue{margin:2em 0;padding:6px 0 6px 26px;border-left:3px solid var(--or)}
.exergue p{font:600 clamp(23px,2.8vw,28px)/1.35 var(--titre);color:var(--nuit);margin:0}
.exergue footer{margin-top:12px;font:500 12px/1.4 var(--texte);letter-spacing:.14em;text-transform:uppercase;color:var(--gris)}

/* Encadré « Repères » (chiffres, dates, noms à retenir) */
.reperes{margin-block:2.4em;background:var(--nuit);color:#e9edf2;padding:30px 34px;display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:20px 36px;border-top:3px solid var(--or)}
.reperes h3{margin:0;font:500 12px/1.4 var(--texte);letter-spacing:.16em;text-transform:uppercase;color:var(--or)}
.reperes h3 b{display:block;margin-top:10px;font:700 24px/1.2 var(--titre);letter-spacing:0;text-transform:none;color:#fff}
.reperes dl{margin:0;display:grid}
.reperes dl div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;padding:12px 0;border-top:1px solid rgba(255,255,255,.12)}
.reperes dl div:first-child{border-top:0;padding-top:0}
.reperes dt{font:700 24px/1.1 var(--titre);color:var(--or)}
.reperes dd{margin:0;font:400 15.5px/1.55 var(--texte);color:#c9d2de}
.reperes ul{list-style:none;margin:0;padding:0;display:grid}
.reperes li{padding:11px 0;border-top:1px solid rgba(255,255,255,.12);font:400 15.5px/1.55 var(--texte);color:#c9d2de}
.reperes li:first-child{border-top:0;padding-top:0}
.reperes li strong{color:#fff;font-weight:500}
.reperes .source{grid-column:1/-1;margin:0;font-size:12.5px;color:#8e9aab}

/* Encadré clair (analyse, moment fort) */
.encadre{margin-block:2em;background:var(--clair);padding:24px 28px;border-top:3px solid var(--or)}
.encadre h3{margin:0 0 .6em;font:700 21px/1.3 var(--titre);color:var(--nuit)}
.encadre>*{margin-block:0}
.encadre>*+*{margin-top:.9em}

/* Graphiques */
.graphique{margin-block:2.2em;background:#fff;border:1px solid var(--filet);padding:22px 24px 14px}
.graphique h3{margin:0 0 14px;font:500 12px/1.4 var(--texte);letter-spacing:.14em;text-transform:uppercase;color:var(--gris)}
.graphique .zone-graphique{position:relative;height:300px}
.graphiques-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-block:2.2em}
.graphiques-duo .graphique{margin:0}

.sources{margin-top:2.4em;padding-top:18px;border-top:1px solid var(--filet);font-size:14px;color:var(--gris)}
.sources h3{margin:0 0 8px;font:500 12px/1.4 var(--texte);letter-spacing:.14em;text-transform:uppercase;color:var(--gris)}
.sources ul{margin:0;padding-left:1.1em}
.sources a{color:var(--nuit)}

.bio{display:grid;grid-template-columns:56px minmax(0,1fr);gap:16px;margin-top:40px;padding:22px 0;border-top:2px solid var(--nuit);border-bottom:1px solid var(--filet)}
.bio .monogramme{width:56px;height:56px;font-size:21px}
.bio b{font:700 19px/1.3 var(--titre);color:var(--nuit)}
.bio p{margin:4px 0 0;font-size:15px;color:var(--gris)}
.article .consulting-discret{font-size:16px;margin-top:2.2em}

.aussi{padding:72px var(--gouttiere) 0}
.aussi .grille{grid-template-columns:repeat(3,minmax(0,1fr))}
.aussi .rub{display:block;font:700 12px/1 var(--texte);letter-spacing:.14em;text-transform:uppercase;color:var(--or-texte);margin-bottom:12px}
.article-inscription{margin-block:72px}

/* Médias présents (texte à la place des logos) */
.medias{padding:16px 0;border-top:1px solid var(--filet);border-bottom:1px solid var(--filet);text-align:center}
.medias>*{margin:0}
.medias h3{font:500 12px/1.4 var(--texte);letter-spacing:.14em;text-transform:uppercase;color:var(--gris);margin:0 0 8px}
.medias .medias-noms{font:700 22px/1.3 var(--titre);color:var(--nuit)}
.medias .medias-noms i{font-style:normal;color:var(--or);margin:0 .35em}
.medias .medias-noms+p{margin-top:6px;font-size:15px;color:var(--gris)}

/* Tableaux */
.tableau{overflow-x:auto;margin-block:2em;border-top:3px solid var(--or)}
.tableau table{width:100%;border-collapse:collapse;font:400 15px/1.5 var(--texte);min-width:640px}
.tableau th{background:var(--nuit);color:#fff;font-weight:500;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;text-align:left;padding:12px 14px}
.tableau td{padding:12px 14px;border-bottom:1px solid var(--filet);vertical-align:top;color:#1f2833}
.tableau tbody tr:nth-child(even) td{background:var(--clair)}
.tableau td span{display:inline-block;padding:2px 8px;background:rgba(244,196,48,.18);color:var(--nuit);font-size:13px;border-radius:2px}
.tableau td:first-child{white-space:nowrap;font-weight:500;color:var(--nuit)}

@media (max-width:900px){
  .aussi .grille,.graphiques-duo{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .article .chapo{font-size:19px}
  .texte{font-size:17.5px}
  .reperes{grid-template-columns:1fr;padding:24px 20px}
  .reperes dl div{grid-template-columns:96px minmax(0,1fr)}
  .graphiques-duo{grid-template-columns:1fr}
  .aussi{padding-top:56px}
}
@media (max-width:520px){
  .aussi .grille{grid-template-columns:1fr}
  .exergue{padding-left:18px}
  .graphique{padding:16px}
}
