/* Un seul volume dans le rayon sciences — 05/09/2026.
 *
 * ⚠ POURQUOI UN FICHIER NEUF PLUTOT QU'UNE RETOUCHE DE rayons-20260904.css.
 * Les assets sont servis avec Cache-Control: max-age=86400. Modifier un fichier
 * existant le laisse invisible jusqu'a 24 h chez un visiteur qui l'a deja charge ;
 * en AJOUTER un est immediat, parce que son URL n'a jamais ete vue. La regle du
 * projet est donc : on ajoute un asset, on n'en modifie jamais un. C'est aussi
 * pour cela que rayons-20260904.css porte sa date dans son nom.
 *
 * Ce fichier se charge APRES rayons-20260904.css et ne fait qu'ajouter .solo.
 * Rien n'y est surcharge : .progression n'est plus employe sur l'accueil, mais la
 * regle reste en place et ne gene personne.
 *
 * La disposition reprend celle du bloc thriller (image a gauche, filet vertical,
 * texte a droite) SANS la reutiliser : .huis-clos porte des couleurs ecrites en
 * dur pour un fond sombre (#f3ede3 sur #14161b), et le rayon sciences est clair
 * (--g-bg:#eceef4). Les memes classes y auraient donne du texte creme sur du
 * gris pale.
 */

.solo{
  max-width:780px; margin:0 auto; display:flex; gap:2.4rem; align-items:flex-start;
}
.solo img{
  width:190px; flex:0 0 190px; border-radius:4px;
  box-shadow:0 14px 30px rgba(14,26,43,.22);
}
.solo .s-body{border-left:3px solid var(--gold-d); padding-left:1.7rem}
.solo h3{font-size:1.3rem; color:var(--navy); margin:0 0 .35rem}
.solo .s-line{
  font-style:italic; color:var(--gold-d); font-size:1.04rem; margin:.5rem 0 1rem;
}
.solo p{color:var(--muted); font-size:.98rem; margin:.7rem 0 0}
/* ⚠ .s-parts n'est PAS portée par .solo : l'accueil l'emploie dans un bloc .solo,
   la page essais dans un article.book. Scopée sous .solo, elle ne s'appliquait que sur
   l'accueil — mesuré, border-left calculé à 0px sur /essais. La règle est donc libre. */
.s-parts{margin:1.1rem 0 0; padding:0; list-style:none}
.s-parts li{
  color:var(--muted); font-size:.95rem; margin:.5rem 0; padding-left:.9rem;
  border-left:2px solid rgba(14,26,43,.14);
}
.s-parts strong{color:var(--navy)}

@media(max-width:720px){
  .solo{flex-direction:column; align-items:center; text-align:center}
  .solo img{width:170px; flex-basis:auto}
  .solo .s-body{border-left:none; border-top:3px solid var(--gold-d); padding:1.2rem 0 0}
  .s-parts li{border-left:none; padding-left:0}
}