/* actualites.css — PROMETI */

*,*::before,*::after{ box-sizing:border-box; }
button,input,textarea,select{ font-family:inherit; font-size:inherit; }
.container{ width:min(1280px,94%); margin:0 auto; }

body{ background:#fff; color:#071526; }
.page-bg-gradient{ background:#fff; }

/* HERO */
.actu-hero{
  padding-top:76px;
  background:#fff;
}
.actu-hero-inner{
  width:min(1200px,94%); margin:0 auto;
  text-align:center; padding:44px 0 36px;
}

.actu-hero-title{
  font-family:'Barlow Condensed','Arial Narrow',Arial,sans-serif;
  font-size:clamp(26px,3.8vw,50px); font-weight:900; line-height:.92;
  letter-spacing:.04em; text-transform:uppercase; color:#071526; margin:0;
}
.actu-hero-title .accent{ color:var(--blue); }

@keyframes lineShine{
  0%  { left:-40%; }
  50% { left:120%; }
  100%{ left:120%; }
}
.actu-hero-underline{
  width:min(400px,78%); height:3px; margin:22px auto 0;
  border-radius:999px; position:relative; overflow:hidden;
  background:linear-gradient(90deg,transparent,#0ea5e9 30%,#3b82f6 50%,#0ea5e9 70%,transparent);
}
.actu-hero-underline::after{
  content:""; position:absolute; top:0; left:-40%; width:40%; height:100%;
  background:linear-gradient(90deg,transparent,rgba(59,130,246,.70),transparent);
  animation:lineShine 3.5s ease-in-out infinite;
}

.actu-hero-lead{
  margin:20px auto 0;
  font-size:17.5px; line-height:1.74; font-weight:500;
  color:#7a93ab; letter-spacing:.012em;
  white-space:nowrap;
}

/* ═══════════════════════════════════════════════════════════════
   FILTRES
   ═══════════════════════════════════════════════════════════════ */
.actu-filters{
  display:flex; align-items:center; justify-content:center;
  gap:8px; flex-wrap:wrap;
  padding:0 0 36px;
  background:#fff;
}
.filter-btn{
  height:38px; display:inline-flex; align-items:center;
  padding:0 20px; border-radius:999px;
  border:1.5px solid #dce5ef; background:#fff;
  color:#6b84a0; font-weight:600; font-size:12px; letter-spacing:.05em;
  cursor:pointer; white-space:nowrap;
  transition:background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
  -webkit-appearance:none; appearance:none;
}
.filter-btn:hover{
  background:#edf5fd; border-color:rgba(14,165,233,.45); color:var(--blue);
}
.filter-btn.active{
  background:var(--blue); border-color:var(--blue);
  color:#fff; font-weight:700;
  box-shadow:0 4px 16px rgba(14,165,233,.28);
}

/* ═══════════════════════════════════════════════════════════════
   SECTION — fond blanc
   ═══════════════════════════════════════════════════════════════ */
.news-section{ padding:0 0 60px; background:#fff; }
.news-featured{ margin-bottom:20px; }

.news-grid-heading{
  display:flex; align-items:center; gap:28px; margin:52px 0 44px;
}
.news-grid-heading-line{
  flex:1; height:2px; border-radius:999px;
  background:linear-gradient(90deg, transparent 0%, rgba(14,165,233,.22) 30%, rgba(14,165,233,.65) 100%);
}
.news-grid-heading span + .news-grid-heading-line{
  background:linear-gradient(270deg, transparent 0%, rgba(14,165,233,.22) 30%, rgba(14,165,233,.65) 100%);
}
.news-grid-heading span{
  font-size:13.5px; font-weight:900; letter-spacing:.20em; text-transform:uppercase;
  color:#071526; white-space:nowrap; flex-shrink:0;
  padding:0 4px; position:relative;
}
.news-grid-heading span::before,
.news-grid-heading span::after{
  content:""; display:inline-block; width:5px; height:5px;
  border-radius:50%; background:var(--blue);
  vertical-align:middle; margin:0 12px; margin-bottom:2px;
  opacity:.75;
}

/* ═══════════════════════════════════════════════════════════════
   BADGES CATÉGORIES
   ═══════════════════════════════════════════════════════════════ */
.badge-realisation  { background:rgba(16,185,129,.85); }
.badge-contrat      { background:rgba(14,165,233,.85); }
.badge-recrutement  { background:rgba(139,92,246,.85); }
.badge-innovation   { background:rgba(245,158,11,.85); }
.badge-evenement    { background:rgba(236,72,153,.85); }
.badge-partenariat  { background:rgba(20,184,166,.85); }
.badge-certification{ background:rgba(245,158,11,.90); }

/* ═══════════════════════════════════════════════════════════════
   CARTE VEDETTE — premium editorial
   ═══════════════════════════════════════════════════════════════ */
.news-card-featured{
  display:grid; grid-template-columns:28% 72%;
  border-radius:20px; overflow:hidden;
  min-height:340px;
  border:1px solid rgba(7,21,38,.08);
  box-shadow:0 2px 4px rgba(7,21,38,.04),
             0 12px 32px rgba(7,21,38,.08),
             0 32px 64px rgba(7,21,38,.06);
  transition:transform .38s cubic-bezier(.22,1,.36,1),
             box-shadow .38s ease;
  cursor:default;
}
.news-card-featured:hover{
  transform:translateY(-6px);
  box-shadow:0 4px 8px rgba(7,21,38,.05),
             0 20px 48px rgba(7,21,38,.12),
             0 48px 80px rgba(7,21,38,.09);
}

/* ── Image côté gauche — pleine et nette ── */
.news-card-featured .nc-photo{
  position:relative; overflow:hidden; align-self:stretch;
}
.news-card-featured .nc-photo img{
  width:100%; height:100%;
  object-fit:cover; object-position:center center;
  display:block; will-change:transform;
  transition:transform 1.1s cubic-bezier(.25,.46,.45,.94),
             filter 1.1s ease;
  filter:brightness(.93) saturate(1.05);
}
/* Image certification — affichage complet, fond assorti */
.news-card-featured[data-category="certification"] .nc-photo{
  background:#091525;
}
.news-card-featured[data-category="certification"] .nc-photo img{
  width:100%; height:100%;
  object-fit:contain;
  object-position:0% center;
  filter:brightness(1) saturate(1.02);
}
/* Pas d'overlay de fondu à droite pour la certification */
.news-card-featured[data-category="certification"] .nc-photo-overlay{
  display:none;
}
.news-card-featured:hover .nc-photo img{
  transform:scale(1.04);
  filter:brightness(1.0) saturate(1.08);
}
/* Overlay très léger — image reste lisible */
.news-card-featured .nc-photo-overlay{
  position:absolute; inset:0;
  background:linear-gradient(to right, transparent 72%, rgba(7,21,38,.55) 100%),
             linear-gradient(to bottom, rgba(7,21,38,.08) 0%, transparent 25%, transparent 70%, rgba(7,21,38,.18) 100%);
}
/* Légende de localisation sur l'image */
.nc-photo-caption{
  position:absolute; bottom:16px; left:18px; z-index:2;
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 12px; border-radius:999px;
  background:rgba(4,10,22,.58); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.12);
  font-size:10px; font-weight:700; letter-spacing:.10em;
  text-transform:uppercase; color:rgba(255,255,255,.80);
}
.nc-photo-caption svg{ flex-shrink:0; stroke:rgba(255,255,255,.70); }

/* ── Panneau contenu — dark navy, structure éditoriale ── */
.news-card-featured .nc-body{
  background:#28405c;
  padding:44px 48px 44px 48px;
  display:flex; flex-direction:column; justify-content:center;
  position:relative; overflow:visible;
  border-left:none;
}

/* Accent bleu en haut — ligne fine de 3px */
.news-card-featured .nc-body::before{
  content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--blue) 0%, rgba(56,189,248,.50) 50%, transparent 100%);
  z-index:2;
}
/* Lueur bleue très subtile en fond */
.news-card-featured .nc-body::after{
  content:""; position:absolute;
  top:-60px; right:-60px; width:200px; height:200px;
  background:radial-gradient(circle, rgba(14,165,233,.08) 0%, transparent 65%);
  pointer-events:none;
}

/* Eyebrow — label "À la une" */
.nc-featured-label{
  font-size:9.5px; font-weight:800; letter-spacing:.30em;
  text-transform:uppercase; color:var(--blue);
  margin:0 0 18px; position:relative; z-index:1;
}

/* ── Badge + date ── */
.nc-meta-top{
  display:flex; align-items:center; gap:10px; margin-bottom:20px;
  position:relative; z-index:1;
}
.nc-badge-inline{
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 12px; border-radius:4px;
  font-size:9.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#fff;
}
.nc-badge-inline.badge-realisation  { background:rgba(16,185,129,.90); }
.nc-badge-inline.badge-contrat      { background:rgba(14,165,233,.90); }
.nc-badge-inline.badge-recrutement  { background:rgba(139,92,246,.90); }
.nc-badge-inline.badge-innovation   { background:rgba(245,158,11,.90); }
.nc-badge-inline.badge-evenement    { background:rgba(236,72,153,.90); }
.nc-badge-inline.badge-partenariat  { background:rgba(20,184,166,.90); }
.nc-badge-inline.badge-certification{ background:rgba(245,158,11,.90); }

.nc-meta-dot{
  width:3px; height:3px; border-radius:50%;
  background:rgba(255,255,255,.22); flex-shrink:0;
}
.nc-date-top{
  font-size:10.5px; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:rgba(255,255,255,.38);
}

/* ── Titre ── */
.news-card-featured .nc-title{
  font-family:var(--font-display);
  font-size:clamp(17px,1.6vw,23px); font-weight:900;
  line-height:1.20; letter-spacing:.025em; text-transform:uppercase;
  color:#fff; margin:0 0 18px;
  position:relative; z-index:1;
}

/* ── Séparateur — ligne pleine largeur dégradée ── */
.news-card-featured .nc-divider{
  width:100%; height:1px; border-radius:0;
  background:linear-gradient(90deg,
    var(--blue) 0%,
    rgba(56,189,248,.30) 40%,
    rgba(255,255,255,.06) 70%,
    transparent 100%);
  margin:0 0 20px; flex-shrink:0;
  position:relative; z-index:1;
}

/* ── Résumé ── */
.news-card-featured .nc-excerpt{
  font-size:15px; line-height:1.90;
  color:rgba(255,255,255,.72);
  margin:0 0 28px; flex:1;
  max-width:520px;
  position:relative; z-index:1;
  font-family:'Inter','Helvetica Neue',Arial,sans-serif;
  font-weight:400;
  letter-spacing:.01em;
}
/* Accroche spécifique à la carte certification */
.news-card-featured[data-category="certification"] .nc-excerpt{
  font-size:15.5px; line-height:1.85;
  color:rgba(255,255,255,.84);
  text-align:left;
  max-width:100%;
  background:none;
  border:none;
  padding:0;
  hyphens:none; -webkit-hyphens:none;
}

/* ── Rangée CTA + référence projet ── */
.nc-cta-row{
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; position:relative; z-index:1;
}
.nc-project-ref{
  font-size:10px; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:rgba(255,255,255,.22);
  white-space:nowrap;
}

/* ── CTA — bouton bleu plein ── */
.news-card-featured .nc-cta{
  display:inline-flex; align-items:center; gap:10px;
  padding:11px 22px; border-radius:7px;
  background:var(--blue); border:none; color:#fff;
  font-size:10.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  cursor:pointer; flex-shrink:0;
  transition:background .22s ease, gap .22s ease, transform .22s ease,
             box-shadow .22s ease;
  -webkit-appearance:none; appearance:none;
}
.news-card-featured .nc-cta:hover{
  background:#0284c7; gap:14px; transform:translateY(-2px);
  box-shadow:0 6px 20px rgba(14,165,233,.38);
}
.news-card-featured .nc-cta svg{
  width:12px; height:12px; flex-shrink:0;
  transition:transform .22s ease;
}
.news-card-featured .nc-cta:hover svg{ transform:translateX(4px); }

/* ═══════════════════════════════════════════════════════════════
   GRILLE 3 COLONNES — style précédent (blanc, sobre)
   ═══════════════════════════════════════════════════════════════ */
.news-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:26px;
}
.news-card.hidden{ display:none; }

.news-card{
  border-radius:16px; overflow:hidden;
  background:#fff;
  border:1px solid #e4ecf4;
  box-shadow:0 2px 4px rgba(7,21,38,.03), 0 8px 24px rgba(7,21,38,.07);
  display:flex; flex-direction:column;
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  cursor:default; position:relative;
}
.news-card::after{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:var(--blue); border-radius:16px 0 0 16px;
  opacity:0; transition:opacity .28s ease;
}
.news-card:hover{ transform:translateY(-6px); border-color:rgba(14,165,233,.22); box-shadow:0 4px 8px rgba(7,21,38,.04), 0 24px 56px rgba(7,21,38,.12); }
.news-card:hover::after{ opacity:1; }
.news-card:hover .nc-title{ color:var(--blue); }

/* Photo */
.nc-photo{ position:relative; overflow:hidden; aspect-ratio:3/2; }
.nc-photo img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; transition:transform .75s ease; }
.news-card:hover .nc-photo img{ transform:scale(1.06); }
.nc-photo-overlay{ position:absolute; inset:0; background:linear-gradient(to bottom, transparent 50%, rgba(7,21,38,.30) 100%); }

/* Badge catégorie grille */
.nc-badge{
  position:absolute; top:14px; left:14px; z-index:2;
  padding:4px 12px; border-radius:999px;
  font-size:9px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:#fff; backdrop-filter:blur(6px);
}

/* Corps grille */
.news-card .nc-body{
  padding:22px 24px 26px; display:flex; flex-direction:column; flex:1;
}
.nc-card-date{
  display:block; font-size:10.5px; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:#a8bece; margin-bottom:10px;
}
.nc-title{
  font-family:var(--font-display);
  font-size:clamp(14px,1.15vw,16.5px); font-weight:900;
  line-height:1.20; letter-spacing:.02em; text-transform:uppercase;
  color:#071526; margin:0 0 12px;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
  transition:color .22s ease;
}
.nc-divider{
  width:28px; height:2px; border-radius:999px;
  background:var(--blue); margin:0 0 14px; flex-shrink:0;
}
.nc-excerpt{
  font-size:13px; line-height:1.74; color:#6d8aa0; flex:1; margin:0 0 20px;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.news-card .nc-cta{
  display:inline-flex; align-items:center; gap:8px;
  padding:0; background:transparent; border:none;
  color:var(--blue); font-size:10.5px; font-weight:800;
  letter-spacing:.12em; text-transform:uppercase; cursor:pointer;
  align-self:flex-start; transition:gap .22s ease, color .22s ease;
  -webkit-appearance:none; appearance:none;
}
.news-card .nc-cta:hover{ gap:12px; color:#071526; }
.news-card .nc-cta svg{ width:12px; height:12px; flex-shrink:0; }

/* ═══════════════════════════════════════════════════════════════
   MODAL ARTICLE COMPLET
   ═══════════════════════════════════════════════════════════════ */
.article-modal{
  position:fixed; inset:0; z-index:9999;
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity .26s ease;
}
.article-modal.open{ opacity:1; pointer-events:all; }
.am-backdrop{
  position:absolute; inset:0;
  background:rgba(4,10,22,.82); backdrop-filter:blur(14px);
  cursor:pointer;
}
.am-panel{
  position:relative; z-index:1;
  width:min(760px,94%); max-height:88vh;
  background:#fff; border-radius:20px; overflow:hidden;
  display:flex; flex-direction:column;
  box-shadow:0 48px 96px rgba(4,10,22,.25);
  transform:translateY(28px); transition:transform .34s cubic-bezier(.22,1,.36,1);
}
.article-modal.open .am-panel{ transform:translateY(0); }
.am-photo{ display:none; }
.am-photo-badge{ display:none; }
.am-close{
  position:absolute; top:14px; right:14px; z-index:10;
  width:36px; height:36px; border-radius:50%;
  background:rgba(7,21,38,.08); border:1px solid rgba(7,21,38,.15);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  -webkit-appearance:none; appearance:none; transition:background .18s ease, border-color .18s ease;
}
.am-close:hover{ background:rgba(7,21,38,.16); border-color:rgba(7,21,38,.28); }
.am-close svg{ width:16px; height:16px; stroke:#071526; stroke-width:2.2; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.am-body{ padding:36px 42px 52px; overflow-y:auto; flex:1; -webkit-overflow-scrolling:touch; }
.am-date{ font-size:10.5px; font-weight:700; letter-spacing:.14em; color:#a8bece; text-transform:uppercase; margin:0 0 12px; }
.am-title{ font-family:var(--font-display); font-size:clamp(19px,2.2vw,28px); font-weight:900; text-transform:uppercase; letter-spacing:.03em; line-height:1.14; color:#071526; margin:0 0 18px; }
.am-divider{ width:40px; height:2.5px; border-radius:999px; background:var(--blue); margin:0 0 24px; }
.am-text{ font-size:14.5px; line-height:1.88; color:#4d6b84; display:flex; flex-direction:column; }
.am-text p{ margin:0 0 20px; }
.am-text p:last-child{ margin:0; }

/* ═══════════════════════════════════════════════════════════════
   REVEAL ON SCROLL
   ═══════════════════════════════════════════════════════════════ */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .55s ease, transform .55s ease; }
.reveal.is-visible{ opacity:1; transform:translateY(0); }
.news-card.reveal.is-visible{ transition-delay:var(--delay,0s); }

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:1100px){
  .news-card-featured{ grid-template-columns:28% 72%; }
  .news-card-featured .nc-body{ padding:36px 36px 36px 40px; }
}
@media (max-width:960px){
  .news-card-featured{ grid-template-columns:1fr; min-height:auto; }
  .news-card-featured .nc-photo{ min-height:280px; }
  .news-card-featured .nc-photo-overlay{
    background:linear-gradient(to bottom, transparent 55%, rgba(7,21,38,.60) 100%);
  }
  .news-card-featured .nc-body{ padding:32px 28px; }
  .nc-photo-caption{ display:none; }
  .news-grid{ grid-template-columns:repeat(2,1fr); }
  .actu-hero-lead{ white-space:normal; }
}
@media (max-width:640px){
  .news-grid{ grid-template-columns:1fr; gap:18px; }
  .actu-hero-inner{ padding:48px 0 40px; }
  .news-card-featured .nc-body{ padding:28px 22px; }
  .news-section{ padding:0 0 40px; }
  .actu-filters{ padding:0 0 36px; }
  .actu-hero-lead{ font-size:13.5px; }
}

/* ═══════════════════════════════════════════════════════════════
   BOUTON "VOIR LES DÉTAILS" dans le modal article
   ═══════════════════════════════════════════════════════════════ */
.am-cert-btn{
  display:flex; align-items:center; gap:10px;
  width:fit-content; margin-top:28px; margin-left:auto;
  padding:7px 22px;
  background:#0c1f3a;
  color:rgba(255,255,255,.90); font-size:12.5px; font-weight:700; letter-spacing:.6px; text-transform:uppercase;
  border:1px solid rgba(255,255,255,.15); border-radius:8px; cursor:pointer;
  box-shadow:0 2px 10px rgba(6,24,46,.30), inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
}
.am-cert-btn::after{
  content:"→";
  font-size:14px; font-weight:400;
  transition:transform .2s ease;
  display:inline-block;
}
.am-cert-btn:hover{
  transform:translateY(-2px);
  background:#0a1a33;
  border-color:rgba(255,255,255,.28);
  box-shadow:0 6px 20px rgba(6,24,46,.45), inset 0 1px 0 rgba(255,255,255,.12);
}
.am-cert-btn:hover::after{ transform:translateX(4px); }

/* ═══════════════════════════════════════════════════════════════
   VISIONNEUSE CERTIFICAT PDF.js
   ═══════════════════════════════════════════════════════════════ */
.certif-modal{
  position:fixed; inset:0; z-index:10000;
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transition:opacity .25s;
}
.certif-modal.certif-modal-open{ opacity:1; pointer-events:auto; }
.certif-modal-backdrop{
  position:absolute; inset:0;
  background:rgba(4,14,28,.82);
  backdrop-filter:blur(4px);
}
.certif-modal-box{
  position:relative; z-index:1;
  background:#0c1f3a;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  width:min(860px,96vw);
  max-height:92vh;
  display:flex; flex-direction:column;
  overflow:hidden;
  box-shadow:0 24px 64px rgba(0,0,0,.6);
}
.certif-modal-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 20px;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:#0a1a33;
  flex-shrink:0;
}
.certif-modal-label{
  color:rgba(255,255,255,.85); font-size:14px; font-weight:600; letter-spacing:.5px;
}
.certif-modal-viewer{
  flex:1; overflow:auto; display:flex; align-items:flex-start; justify-content:center;
  padding:16px;
  background:#06182e;
  position:relative;
}
.certif-modal-viewer canvas{ max-width:100%; display:block; border-radius:4px; box-shadow:0 8px 32px rgba(0,0,0,.5); }
.certif-loader{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:#06182e;
}
.certif-spinner{
  width:44px; height:44px;
  border:4px solid rgba(255,255,255,.15);
  border-top-color:#60a5fa;
  border-radius:50%;
  animation:certifSpin .75s linear infinite;
}
@keyframes certifSpin{ to{ transform:rotate(360deg); } }
.certif-modal-nav{
  display:flex; align-items:center; justify-content:center; gap:20px;
  padding:12px 20px;
  border-top:1px solid rgba(255,255,255,.08);
  background:#0a1a33;
  flex-shrink:0;
}
.certif-nav-btn{
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15);
  color:#fff; border-radius:8px; padding:7px 16px; cursor:pointer; font-size:18px;
  transition:background .18s, border-color .18s;
}
.certif-nav-btn:hover{ background:rgba(255,255,255,.18); }

/* Bouton Fermer — même forme ronde que .am-close */
#certifClose{
  width:36px; height:36px; padding:0;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:15px; line-height:1;
  flex-shrink:0;
}
#certifClose:hover{ border-color:rgba(255,255,255,.35); }
.certif-page-info{ color:rgba(255,255,255,.70); font-size:13px; min-width:60px; text-align:center; }

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE MOBILE — modals
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:600px){
  /* Article modal */
  .am-panel{
    width:100%; max-height:92dvh;
    border-radius:16px 16px 0 0;
    position:fixed; bottom:0; left:0; right:0;
    transform:translateY(100%);
  }
  .article-modal.open .am-panel{ transform:translateY(0); }
  .am-body{ padding:22px 18px 32px; }
  .am-title{ font-size:18px; }

  /* Certificat modal */
  .certif-modal{ align-items:flex-end; }
  .certif-modal-box{
    width:100%; max-height:92dvh;
    border-radius:16px 16px 0 0;
  }
  .certif-modal-header{ padding:12px 14px; }
  .certif-modal-viewer{ padding:10px; }
  .certif-modal-nav{ padding:10px 14px 14px; gap:14px; }
  .certif-page-info{ min-width:48px; font-size:12px; }
}