/* ============================================================
   ARTICLE - pages actualités / publications
   (en-tête sombre, corps de texte, thématiques, contact)
   Chargé uniquement sur les pages actualites/*.html.
   ============================================================ */

/* ---------- EN-TETE D'ARTICLE (fond sombre) ---------- */
.article-hero{
  position:relative;color:#fff;
  padding:8.5rem 3rem 5.5rem;
  overflow:hidden;
  background:
    radial-gradient(120% 90% at 75% 15%, rgba(120,130,155,.35), transparent 60%),
    linear-gradient(160deg, #3a3f4f 0%, var(--slate) 45%, var(--slate-deep) 100%);
}
.article-hero::before{
  content:'';position:absolute;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  pointer-events:none;
}
.article-hero-inner{position:relative;max-width:1300px;margin:0 auto;}

/* Titre + colonne méta */
.article-hero-grid{
  display:grid;grid-template-columns:1fr 320px;gap:5rem;
  align-items:start;
}
.article-hero h1{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(1.9rem, 3.4vw, 3.2rem);line-height:1.35;
  color:var(--teal-light);
  max-width:26ch;
}
.article-meta{
  border-left:1px solid rgba(255,255,255,.25);
  padding-left:3rem;
  font-family:var(--display);
}
.meta-block{margin-bottom:2.4rem;}
.meta-block:last-child{margin-bottom:0;}
.meta-label{
  display:block;margin-bottom:.9rem;
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-family:var(--blair);font-weight:300;
  color:#fff;
}
.cat-badge{
  display:inline-block;
  background:#fff;color:var(--ink);
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-family:var(--blair);font-weight:300;
  padding:.55rem .9rem;white-space:nowrap;
}
.article-meta .date{display:block;margin-top:1.4rem;color:rgba(255,255,255,.85);}

/* ---------- CORPS DE L'ARTICLE (fond sable) ---------- */
.article-body{
  background:var(--sand);color:var(--ink-soft);
  padding:5.5rem 3rem 4rem;
  font-family:var(--display);
}
.article-prose{max-width:780px;margin:0 auto;}
.article-prose .chapo{
  font-weight:600;color:var(--ink-soft);
  font-size:1.02rem;line-height:1.85;
  margin-bottom:2.2rem;
}
.article-prose p{
  font-size:.98rem;font-weight:300;color:var(--ink-mid);line-height:1.95;
  margin-bottom:1.3rem;
}
.article-prose em{font-style:italic;}
.article-prose h2{
  font-family:var(--serif);font-weight:500;
  font-size:1.6rem;line-height:1.35;color:var(--ink-soft);
  margin:3rem 0 1.2rem;
}
.article-prose h3{
  font-size:1rem;font-weight:300;
  letter-spacing:.1em;text-transform:uppercase;font-family:var(--blair);color:var(--ink-soft);
  margin:2.4rem 0 1rem;
}

/* Thématiques connexes en fin d'article */
.article-themes{
  max-width:780px;margin:4rem auto 0;
  padding-top:3rem;
  border-top:1px solid rgba(43,49,64,.25);
}
.article-themes h2{
  font-size:1.15rem;font-weight:300;
  letter-spacing:.18em;text-transform:uppercase;font-family:var(--blair);color:var(--ink-soft);
  margin-bottom:1.5rem;
}
.article-themes .chips{display:flex;flex-wrap:wrap;gap:.8rem;}

/* ---------- CONTACT EN FIN DE PAGE ---------- */
.article-contact{
  background:var(--sand);color:var(--ink-soft);
  padding:3rem 3rem 7rem;
  font-family:var(--display);
}
.article-contact-inner{max-width:780px;margin:0 auto;}
.article-contact h2{
  font-family:var(--serif);font-weight:500;
  font-size:clamp(1.8rem, 3vw, 2.4rem);color:var(--ink-soft);
  margin-bottom:2.5rem;
}
.contact-card{display:block;width:280px;}
.contact-card .photo{
  display:block;width:280px;height:320px;
  object-fit:cover;object-position:center top;
  clip-path:polygon(30px 0, 100% 0, 100% 100%, 0 100%, 0 30px);
  filter:grayscale(1);
  transition:filter .5s var(--ease-out);
}
.contact-card:hover .photo{filter:grayscale(0);}
.contact-card-info{
  display:flex;justify-content:space-between;align-items:flex-end;
  gap:1rem;margin-top:1.2rem;
}
.contact-card .role{font-size:.92rem;font-weight:300;color:var(--ink-mid);}
.contact-card .name{
  margin-top:.35rem;
  font-size:.95rem;font-weight:300;letter-spacing:.12em;text-transform:uppercase;font-family:var(--blair);
}
.contact-card .more{
  flex-shrink:0;
  width:44px;height:44px;
  background:var(--teal-light);color:#20283a;
  display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;font-weight:300;line-height:1;
  transition:background .25s;
}
.contact-card .more:hover{background:var(--teal);}

/* ---------- RESPONSIVE ---------- */
@media (max-width:900px){
  .article-hero{padding:6.5rem 1.4rem 3.5rem;}
  .breadcrumb{margin-bottom:2.5rem;}
  .breadcrumb .current{max-width:22ch;}
  .article-hero-grid{grid-template-columns:1fr;gap:2.5rem;}
  .article-meta{
    border-left:none;border-top:1px solid rgba(255,255,255,.25);
    padding:2rem 0 0;
  }
  .article-body{padding:3.5rem 1.4rem 3rem;}
  .article-contact{padding:2rem 1.4rem 4.5rem;}
}