/* ==========================================================
   NOS ACTUS — LISTE
   Charte : rose #ff4da6, fond clair, lisibilité forte
   ========================================================== */

:root{
  --pink:#ff4da6;
  --pink-100:#ffe9f5;
  --ink:#111;
}

.container{ width:min(1100px,92vw); margin-inline:auto; }

/* ---- HERO clair rose/blanc ---- */
.actus-hero{
  background: linear-gradient(135deg,#fff 0%, var(--pink-100) 70%, #fff 100%);
  color: var(--ink);
  padding: 48px 0 40px;
  border-bottom: 1px solid #f2e7f0;
  position: relative;
}
.actus-hero::after{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(600px 200px at 10% 10%, rgba(255,77,166,.12), transparent 60%),
    radial-gradient(600px 200px at 90% 20%, rgba(255,77,166,.10), transparent 60%);
  pointer-events:none;
}
.actus-hero h1{
  margin:0 0 8px; font-size: clamp(28px,3.4vw,44px);
  line-height:1.08; letter-spacing:-.02em; font-weight:900;
  color: var(--ink);
}
.actus-hero .lead{ margin:0; color:#444; }

/* ---- Grille cartes ---- */
.actus-list{ padding: 26px 0 64px; }
.cards-grid{
  display:grid; grid-template-columns: repeat(12, 1fr); gap: 22px;
}
@media (max-width:900px){ .cards-grid{ grid-template-columns: repeat(6, 1fr); } }
@media (max-width:600px){ .cards-grid{ grid-template-columns: repeat(4, 1fr); } }

/* ---- Carte ---- */
.actu-card{
  grid-column: span 6;
  display:flex; flex-direction:column;
  border:1px solid #eee; border-radius:14px; overflow:hidden; background:#fff;
  box-shadow: 0 6px 22px rgba(0,0,0,.06);
}
@media (max-width:900px){ .actu-card{ grid-column: span 6; } }
@media (max-width:600px){ .actu-card{ grid-column: span 4; } }

/* media 16:9 robuste (Chrome/Safari/Firefox) */
.actu-card__media{ position:relative; background:#f6f6f7; }
.actu-card__media img{
  width:100%; height:auto; display:block; aspect-ratio:16/9; object-fit:cover;
}
@supports not (aspect-ratio:16/9){
  .actu-card__media{ padding-top:56.25%; }
  .actu-card__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
}

/* badge “type” (inscription, recap, info…) */
.actu-card__kind{
  position:absolute; top:12px; left:12px;
  background:#fff; color:#ff4da6; border:1px solid #ffd1ea;
  padding:6px 10px; border-radius:999px; font-size:12px; font-weight:800;
  letter-spacing:.02em; display:inline-flex; gap:6px; align-items:center;
  box-shadow:0 6px 14px rgba(255,77,166,.15);
}
.actu-card__kind.kind-recap{ color:#4f46e5; border-color:#c7d2fe; }
.actu-card__kind.kind-inscription{ color:#16a34a; border-color:#bbf7d0; }
.actu-card__kind.kind-landing{ color:#ff4da6; border-color:#ffd1ea; }
.actu-card__kind.kind-info{ color:#0284c7; border-color:#bae6fd; }

/* date badge */
.actu-card__date{
  position:absolute; bottom:12px; left:12px;
  background:rgba(255,255,255,.96); color:#222; border-radius:10px;
  padding:6px 10px; font-size:12px; font-weight:700; border:1px solid #eee;
  box-shadow:0 8px 18px rgba(0,0,0,.08);
}

/* body */
.actu-card__body{ padding:14px 14px 16px; display:flex; flex-direction:column; gap:8px; }
.actu-card__title{ margin:0; font-size: clamp(18px, 2vw, 20px); line-height:1.25; }
.actu-card__title a{ color:#111; text-decoration:none; }
.actu-card__title a:hover{ text-decoration:underline; text-underline-offset:3px; }
.actu-card__excerpt{ margin:0; color:#555; font-size:14.5px; }

/* bouton Lire/Read */
.btn-read{
  --bg: #111; --fg: #fff;
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 14px; border-radius:12px; background:var(--bg); color:var(--fg);
  text-decoration:none; font-weight:800; font-size:14px;
  transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease;
}
.btn-read:hover{ transform: translateY(-1px); box-shadow: 0 10px 24px rgba(17,17,17,.18); background:#ff4da6; }
.btn-read svg{ display:block }

/* backlink réutilisable (sans double flèche) */
.backlink{
  display:inline-flex; align-items:center; gap:8px;
  background:#fff; color:#111; border:1px solid #eee;
  padding:8px 12px; border-radius:999px; text-decoration:none; font-weight:700;
  box-shadow:0 6px 18px rgba(0,0,0,.06);
}
.backlink:hover{ background:#111; color:#fff; }

/* Bilingue (si besoin) */
html.lang-fr [lang="en"]{ display:none !important; }
html.lang-en [lang="fr"]{ display:none !important; }

/* --- Ajustement spécifique pour les logos d’événements comme SAP --- */
.actu-card__media img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 16/9;
  object-fit: cover;
}

/* Si le média est un logo carré ou vertical : ne pas le couper */
.actu-card__media img[src*="logo"],
.actu-card__media img[src*="Logo"],
.actu-card__media img[src*="LOGO"] {
  object-fit: contain;       /* au lieu de cover */
  background: #fff;          /* fond neutre pour lisibilité */
  padding: 10%;              /* un peu d’air autour du logo */
  border: 1px solid #eee;    /* rappel des autres cartes */
  border-radius: 10px;
}