/* Nouvel article (plugin fnapara-nouvel-article), écrit à la main le 01/11/2026 : version B des maquettes (carte en
   bas à droite), agrandie sur ordinateur (≥ 1024 px) avec le chapô ; en bas sur toute la largeur sur téléphone. */
.na-b{position:fixed;right:24px;bottom:24px;z-index:900;width:400px;max-width:calc(100% - 24px);display:grid;background:var(--ivoire);border:1px solid var(--ligne);border-left:5px solid var(--rouge);box-shadow:0 14px 40px rgba(0,0,0,.25);color:var(--texte);animation:na-monte .5s cubic-bezier(.22,.9,.25,1)}
.na-b[hidden]{display:none!important}
.na-b.na-sans-img{grid-template-columns:1fr}
/* L'image remplit sa case sans en fixer la hauteur (c'est le texte qui la donne) ; la case suit la forme de l'image. */
.na-b{grid-template-columns:clamp(96px,calc(var(--na-r,1) * 130px),170px) 1fr}
.na-b .na-img{position:relative;display:block;min-width:0;min-height:130px}
.na-b .na-img img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
/* Logo, écusson, document, image de vidéo à bandes : en entier, sur la couleur de son pourtour */
.na-b.na-entiere .na-img{background:var(--na-fond,#fff)}
.na-b.na-entiere .na-img img{object-fit:contain;padding:8px;box-sizing:border-box}
.na-b .na-corps{position:relative;padding:14px 40px 14px 16px;display:grid;gap:6px;align-content:start}
.na-b p{margin:0}
.na-sur{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font:700 .75rem/1.2 var(--tech,sans-serif);letter-spacing:.18em;text-transform:uppercase;color:var(--rouge)}
.na-sur::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--rouge);box-shadow:0 0 0 3px rgba(200,20,26,.18)}
.na-rub{display:none;padding:3px 8px;background:var(--c);color:#fff;font-size:.6875rem;letter-spacing:.12em}
.na-titre{font:700 1.125rem/1.1 var(--cond,sans-serif);text-transform:uppercase;color:var(--vert-f);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.na-titre a{color:inherit;text-decoration:none}
.na-titre a:hover{color:var(--rouge)}
.na-date{color:var(--sec);font-size:.875rem}
.na-chapo{display:none}
.na-suite{font:700 .8125rem/1 var(--tech,sans-serif);letter-spacing:.12em;text-transform:uppercase;color:var(--rouge);text-decoration:none}
.na-suite:hover{text-decoration:underline;text-underline-offset:4px}
.na-fermer{position:absolute;top:2px;right:0;display:grid;place-items:center;width:44px;height:44px;border:0;background:none;color:inherit;cursor:pointer;font-size:1.75rem;line-height:1}
.na-b.na-sortie{animation:na-part .25s ease forwards}
@keyframes na-monte{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes na-part{to{opacity:0;transform:translateY(12px) scale(.98)}}
@media (prefers-reduced-motion:reduce){.na-b{animation:none!important}}
/* Ordinateur : plus grande, avec le chapô */
@media (min-width:1024px){
  /* La case de l'image suit sa forme (largeur = hauteur × proportion, entre 180 et 340 px) ; texte sur 380 px. */
  .na-b{right:32px;bottom:32px;width:auto;grid-template-columns:clamp(180px,calc(var(--na-r,1) * 250px),340px) 380px}
  .na-b.na-sans-img{grid-template-columns:480px}
  .na-b .na-img{min-height:230px}
  .na-b.na-entiere .na-img img{padding:16px}
  .na-b .na-corps{padding:22px 52px 22px 24px;gap:10px}
  .na-rub{display:inline-block}
  .na-titre{font-size:1.5rem}
  .na-chapo{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:1rem;line-height:1.45}
  .na-suite{font-size:.875rem;margin-top:2px}
  .na-fermer{top:6px;right:4px}
}
/* Téléphone */
@media (max-width:700px){
  .na-b{right:12px;left:12px;bottom:12px;width:auto;grid-template-columns:clamp(84px,calc(var(--na-r,1) * 110px),140px) 1fr}
  .na-b .na-img{min-height:110px}
}