/* ── Visual Card — Light (recommandée mockups UI) ── */

/* Surcouche uniquement : vignette + filtre + outline, pas d’ombre portée externe */
.visual-card {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  outline: 1px solid rgba(255,255,255,0.10);
  box-shadow: 0 0 0 1px rgba(255,255,255,0.04);
  isolation: isolate;
}

/* Filter */
.visual-card img {
  filter: saturate(0.94) contrast(1.03) brightness(0.99);
}

/* Vignette : opacité réduite d’1/3 + mode fusion pour adoucir les bords */
.visual-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(ellipse at 50% 50%, transparent 75%, rgba(0,0,0,0.075) 100%);
  mix-blend-mode: multiply;
  z-index: 2;
  pointer-events: none;
}

/* ── Variante forte (photos, contexte industriel) ── */
.visual-card.strong img {
  filter: contrast(1.08) saturate(0.88) brightness(0.97);
}
.visual-card.strong::before {
  background: radial-gradient(
    ellipse at 50% 50%,
    transparent 67%,
    rgba(0, 0, 0, 0.18) 100%
  );
  mix-blend-mode: multiply;
}

/* ── Variante froide (hardware, outdoor) ── */
.visual-card.cold img {
  filter: contrast(1.1) saturate(0.7) brightness(0.95) hue-rotate(10deg);
}
.visual-card.cold::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(
    135deg,
    rgba(30, 60, 120, 0.18) 0%,
    rgba(0, 20, 60, 0.22) 100%
  );
  opacity: 1;
  mix-blend-mode: color;
  z-index: 4;
  pointer-events: none;
}

/* ── Other initiatives : un seul cartouche arrondi (l’article), pas d’ombre qui dépasse ── */
#other-initiatives-cards .other-initiatives-media .visual-card {
  box-shadow: none;
  /* Mobile : visuel en haut → arrondi uniquement en haut */
  border-radius: 12px 12px 0 0;
}
@media (min-width: 1024px) {
  #other-initiatives-cards .other-initiatives-media .visual-card {
    /* Desktop : visuel à gauche → arrondi uniquement à gauche */
    border-radius: 12px 0 0 12px;
  }
}
