/* Page de lecture d'un texte / discours */

.bleed-1{top:-180px;left:-260px;width:520px;height:440px;}
.bleed-2{top:520px;right:-220px;width:480px;height:420px;}
.bleed-3{top:1620px;left:-200px;width:520px;height:420px;}
.bleed-4{bottom:-200px;right:-160px;width:540px;height:480px;}
.scrib.s2{top:1320px;right:8%;width:50px;height:50px;transform:rotate(8deg);}

/* Article hero */
.art-hero{
  position:relative;z-index:5;
  padding:32px 80px 36px 80px;
  display:grid;grid-template-columns:1fr 360px;gap:64px;align-items:end;
  border-bottom:1px dashed rgba(35,38,63,0.18);
}
.crumb{
  font-family:var(--sans);font-size:11px;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--ink-mute);margin-bottom:14px;
  display:flex;align-items:center;gap:10px;
}
.crumb a{color:var(--ink-mute);text-decoration:none;}
.crumb a:hover{color:var(--coral);}
.crumb .sep{opacity:0.6;}
.art-eyebrow{
  display:flex;align-items:center;gap:18px;
  margin-bottom:16px;flex-wrap:wrap;
}
.art-h1{
  font-family:var(--serif);font-weight:500;
  font-size:clamp(56px,6vw,108px);line-height:0.95;
  letter-spacing:-0.02em;margin:0 0 18px 0;
  max-width:780px;
}
.art-h1 .it{font-style:italic;font-weight:400;}
.art-h1 .accent{position:relative;display:inline-block;}
.art-h1 .accent::after{
  content:"";position:absolute;left:-4px;right:8px;bottom:-8px;height:8px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'><path d='M2 7 Q 28 2 60 6 T 122 5 Q 158 8 198 4' stroke='%23F2774E' stroke-width='2.6' fill='none' stroke-linecap='round'/></svg>") center/100% 100% no-repeat;
}
.art-sub{
  font-family:var(--serif);font-style:italic;font-size:22px;
  color:var(--ink-soft);line-height:1.5;max-width:620px;margin:0;
}
.art-meta{
  display:flex;flex-direction:column;gap:14px;padding-bottom:6px;
}
.art-meta .row{display:flex;align-items:baseline;gap:14px;font-family:var(--sans);font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--ink-mute);}
.art-meta .row .key{flex:0 0 90px;}
.art-meta .row .val{font-family:var(--serif);font-style:italic;font-size:17px;color:var(--ink);text-transform:none;letter-spacing:0;}
.art-meta .row .val strong{font-style:normal;font-weight:600;}

/* Quatrième de couverture (résumé des textes longs) */
.art-resume{position:relative;z-index:5;padding:34px 80px 0 80px;}
.art-resume .lab{font-family:var(--sans);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:12px;}
.art-resume .body{font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.6;color:var(--ink);max-width:820px;border-left:3px solid var(--peach);padding:4px 0 4px 26px;background:linear-gradient(to right, rgba(245,192,160,0.16), transparent 72%);}
.art-resume .body p{margin:0 0 0.7em 0;}
.extract-flag{font-family:var(--sans);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--coral);margin-bottom:18px;}
@media (max-width:960px){.art-resume{padding:24px 22px 0 22px;}.art-resume .body{font-size:19px;}}

/* Reading body */
.reader{
  position:relative;z-index:5;
  padding:56px 80px 60px 80px;
  display:grid;grid-template-columns:240px minmax(0,760px);gap:56px;
  align-items:start;
}
.reader .text-col{
  position:relative;
  padding:8px 0 8px 0;
}
.reader .text-col::before{
  content:"";position:absolute;inset:-20px -24px;z-index:-1;
  background:rgba(247,244,236,0.6);
  border-radius:3px;
}
.text-col{
  font-family:var(--serif);font-size:20px;line-height:1.78;color:var(--ink);
}
.text-col p{margin:0 0 1.2em 0;}
.text-col h2,.text-col h2.act{
  font-family:var(--serif);font-weight:500;
  font-size:36px;letter-spacing:-0.005em;line-height:1.05;
  margin:1.6em 0 0.3em 0;color:var(--ink);
  display:flex;align-items:baseline;gap:14px;
}
.text-col h2.act .num{
  font-family:var(--hand);font-style:normal;font-weight:600;
  color:var(--coral);font-size:46px;line-height:1;transform:rotate(-3deg);
}
.text-col h3,.text-col h3.scene{
  font-family:var(--sans);font-size:12px;letter-spacing:0.22em;
  text-transform:uppercase;color:var(--ink-mute);
  margin:1.5em 0 1em 0;
  display:flex;align-items:center;gap:14px;
}
.text-col h3.scene::after{
  content:"";flex:1;height:1px;background:rgba(35,38,63,0.16);
}
.text-col .stage{
  font-family:var(--serif);font-style:italic;font-size:17.5px;
  color:var(--ink-soft);line-height:1.55;
  padding:6px 16px;margin:0.4em 0 1.2em 0;
  border-left:2px solid var(--lilac);
  background:linear-gradient(to right, rgba(198,181,218,0.18), transparent 70%);
}
.text-col .line{display:flex;gap:14px;margin:0 0 0.7em 0;align-items:baseline;}
.text-col .line .who{
  font-family:var(--sans);font-size:11px;font-weight:600;
  letter-spacing:0.18em;text-transform:uppercase;color:var(--coral);
  flex:0 0 130px;text-align:right;padding-top:6px;
}
.text-col .line .what{flex:1;font-family:var(--serif);font-size:20px;line-height:1.65;color:var(--ink);}
.text-col .line .what em{font-style:italic;color:var(--ink-soft);font-size:0.92em;}
.text-col blockquote,.text-col .pull{
  font-family:var(--serif);font-style:italic;font-size:28px;line-height:1.35;
  color:var(--ink);margin:1.6em -20px;padding:14px 24px 14px 32px;
  position:relative;
  border-left:3px solid var(--coral);
  background:linear-gradient(to right, rgba(165,219,193,0.22), transparent 70%);
}
.text-col .pull::before{
  content:"«";position:absolute;left:0;top:-26px;
  font-style:normal;font-size:90px;line-height:1;color:var(--sage);
}

/* Side column */
.side{
  position:sticky;top:24px;
  padding-top:8px;
}
.side .label{font-family:var(--sans);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:18px;}
.side .extras{display:flex;flex-direction:column;gap:14px;}
.side .extras .ex{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--ink-soft);}
.side .extras a.ex{color:var(--coral);text-decoration:none;}

/* Article navigation */
.art-nav{
  position:relative;z-index:5;
  padding:24px 80px 60px 80px;
  display:grid;grid-template-columns:1fr 1fr;gap:24px;
  border-top:1px dashed rgba(35,38,63,0.18);
}
.art-nav a{
  display:flex;flex-direction:column;gap:6px;
  padding:22px 28px;text-decoration:none;color:var(--ink);
  border:1px dashed rgba(35,38,63,0.2);border-radius:3px;
  font-family:var(--serif);
}
.art-nav a:hover{border-color:var(--coral);}
.art-nav .lab{font-family:var(--sans);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-mute);}
.art-nav .tit{font-family:var(--serif);font-style:italic;font-size:22px;line-height:1.2;}
.art-nav .next-link{text-align:right;align-items:flex-end;}

/* Mobile */
@media (max-width:960px){
  .art-hero{grid-template-columns:1fr;gap:24px;padding:22px 22px 24px 22px;}
  .reader{grid-template-columns:1fr;padding:32px 22px 36px 22px;gap:28px;}
  .side{position:relative;top:0;}
  .text-col .line{flex-direction:column;gap:2px;}
  .text-col .line .who{text-align:left;padding-top:0;flex:0 0 auto;}
  .art-h1{font-size:48px;}
  .art-nav{padding:20px 22px 40px 22px;grid-template-columns:1fr;}
}
@media (max-width:720px){
  .art-h1{font-size:42px;}
  .text-col blockquote,.text-col .pull{font-size:22px;margin:1.4em 0;}
  .bleed-1{width:380px;height:340px;top:-120px;left:-180px;}
  .bleed-2{width:340px;height:300px;top:540px;right:-180px;}
  .bleed-3{display:none;}
  .bleed-4{width:380px;height:340px;bottom:-180px;right:-180px;}
}
