/* =====================================================
   Horizon Magazine Manager — hmm-grid  v1.1.2
   ===================================================== */

/* ─── Variables par défaut ──────────────────────────── */
.hmm-grid {
  --hmm-cols: 3;
  --hmm-gap: 24px;
  --hmm-radius: 8px;
  --hmm-card-bg: #ffffff;
  width: 100%;
}

/* ─── Grid container ────────────────────────────────── */
/* On utilise padding sur les items pour le gap — plus robuste
   face aux thèmes Bootstrap qui écrasent le gap CSS Grid */
.hmm-grid__items {
  display: grid;
  grid-template-columns: repeat(var(--hmm-cols), 1fr);
  gap: var(--hmm-gap, 24px);
  align-items: stretch;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* S'assurer que les items ne sont pas affectés par Bootstrap */
.hmm-grid__item {
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box;
}

/* ─── Equal height ──────────────────────────────────── */
.hmm-grid--equal-height .hmm-grid__item {
  display: flex;
  flex-direction: column;
}
.hmm-grid--equal-height .hmm-grid__item .hmm-card {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.hmm-grid--equal-height .hmm-card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
}
/* Bouton et interactions en bas grâce à margin-top: auto */
.hmm-grid--equal-height .hmm-read-more,
.hmm-grid--equal-height .hmm-inter {
  margin-top: auto;
}

/* ─── Card base ─────────────────────────────────────── */
.hmm-card {
  background: var(--hmm-card-bg, #ffffff);
  border-radius: var(--hmm-radius, 8px);
  overflow: hidden;   /* clip l'image dans le radius */
  position: relative;
  transition: box-shadow 0.26s ease;
  border-bottom: none !important; /* Neutralise les bordures du thème */
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* Image en haut de carte — hérite du border-radius de la carte */
.hmm-card > .hmm-img-wrap:first-child,
.hmm-card > a > .hmm-img-wrap:first-child {
  border-radius: var(--hmm-radius, 8px) var(--hmm-radius, 8px) 0 0;
  overflow: hidden;
}

/* Body — padding configurable via --hmm-card-padding */
.hmm-card__body {
  padding: var(--hmm-card-padding, 14px 16px 16px);
}

/* ─── Titre ─────────────────────────────────────────── */
.hmm-card__title {
  margin: 0 0 8px;
  line-height: 1.35;
  font-weight: 700;
}
.hmm-card__title a {
  color: var(--hmm-title-color, var(--hmm-text, #1a1a2e));
  text-decoration: none;
  transition: color 0.2s ease;
}
/* Style inline sur le parent h3 doit prendre le dessus */
.hmm-card__title[style] a {
  color: inherit !important;
}
.hmm-card__title a:hover { color: var(--hmm-accent, #6366f1); }

/* ─── Méta ──────────────────────────────────────────── */
/* Marges explicites selon position */
.hmm-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
  font-size: 11px;
  line-height: 1.4;
}

.hmm-meta--above-title  { margin-bottom: 8px; }
.hmm-meta--below-title  { margin-top: 6px; margin-bottom: 8px; }
.hmm-meta--below-excerpt{ margin-top: 10px; }
.hmm-meta--on-image {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 4;
  background: rgba(0,0,0,.45);
  border-radius: 4px;
  padding: 3px 8px;
}

/* ─── Extrait ───────────────────────────────────────── */
.hmm-card__excerpt {
  margin: 8px 0 0;
  font-size: 13px;
  line-height: 1.6;
  color: var(--hmm-text-muted, #6c757d);
}

/* ─── Hover effects ─────────────────────────────────── */
.hmm-grid--hover-zoom .hmm-img-wrap { overflow: hidden; }
.hmm-grid--hover-zoom .hmm-card:hover .hmm-img { transform: scale(1.06); }

.hmm-grid--hover-fade .hmm-img-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0);
  transition: background 0.26s ease;
  z-index: 1;
}
.hmm-grid--hover-fade .hmm-card:hover .hmm-img-wrap::after { background: rgba(0,0,0,.3); }

.hmm-grid--hover-slide-up .hmm-card__body { transition: transform 0.26s ease; }
.hmm-grid--hover-slide-up .hmm-card:hover .hmm-card__body { transform: translateY(-4px); }

/* ─── Ombres ────────────────────────────────────────── */
.hmm-grid--shadow-soft   .hmm-card { box-shadow: 0 2px 8px rgba(0,0,0,.07); }
.hmm-grid--shadow-medium .hmm-card { box-shadow: 0 4px 16px rgba(0,0,0,.12); }
.hmm-grid--shadow-strong .hmm-card { box-shadow: 0 8px 30px rgba(0,0,0,.18); }
.hmm-grid--shadow-soft   .hmm-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.12); }
.hmm-grid--shadow-medium .hmm-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.16); }
.hmm-grid--shadow-strong .hmm-card:hover { box-shadow: 0 12px 40px rgba(0,0,0,.22); }

/* ─── Colonnes ──────────────────────────────────────── */
.hmm-grid--grid-1 .hmm-grid__items { --hmm-cols: 1; }
.hmm-grid--grid-2 .hmm-grid__items { --hmm-cols: 2; }
.hmm-grid--grid-3 .hmm-grid__items { --hmm-cols: 3; }
.hmm-grid--grid-4 .hmm-grid__items { --hmm-cols: 4; }
.hmm-grid--grid-5 .hmm-grid__items { --hmm-cols: 5; }
.hmm-grid--grid-6 .hmm-grid__items { --hmm-cols: 6; }

.hmm-grid--grid-5 .hmm-card__title,
.hmm-grid--grid-6 .hmm-card__title { font-size: 13px; line-height: 1.3; }
.hmm-grid--grid-5 .hmm-card__body,
.hmm-grid--grid-6 .hmm-card__body  { --hmm-card-padding: 10px 12px 12px; }

/* ─── Overlay ───────────────────────────────────────── */
.hmm-card--overlay {
  overflow: hidden !important;
  background: transparent !important; /* Pas de fond blanc sur overlay */
  border-radius: 0 !important; /* Évite les bugs webkit overflow+border-radius */
  isolation: isolate; /* Crée un nouveau contexte d'empilement */
}
.hmm-card--overlay .hmm-img-wrap {
  display: block !important;
  width: 100% !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  height: 100% !important; /* Remplit le lien overlay, PHP fixe aussi height inline */
}
.hmm-card--overlay .hmm-img-wrap img.hmm-img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  max-width: 100% !important;
  max-height: none !important;
}
.hmm-card__overlay-link {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  color: inherit !important;
  text-decoration: none !important;
  /* Prend toute la hauteur disponible dans la carte */
  height: 100%;
}
.hmm-card__overlay-link { display: block; position: relative; color: inherit; text-decoration: none; }

.hmm-card__overlay {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 16px; z-index: 2;
}
.hmm-card__overlay--overlay-dark {
  background: linear-gradient(to top, rgba(0,0,0,.85) 0%, rgba(0,0,0,.4) 60%, transparent 100%);
  top: 0; display: flex; flex-direction: column; justify-content: flex-end;
}
.hmm-card__overlay--overlay-badge {
  background: linear-gradient(to top, rgba(0,0,0,.75) 0%, rgba(0,0,0,.2) 70%, transparent 100%);
  top: 0; display: flex; flex-direction: column; justify-content: flex-end;
}
.hmm-card__overlay--overlay-band { background: rgba(0,0,0,.78); }
.hmm-card--overlay.hmm-card--overlay-diagonal::before {
  content: ''; position: absolute; top: 0; left: 0;
  width: 60%; height: 100%;
  background: linear-gradient(135deg, rgba(0,0,0,.75) 0%, transparent 60%);
  z-index: 1; pointer-events: none;
}
.hmm-card__overlay .hmm-card__title { color: #fff; margin: 6px 0 0; }
.hmm-card__overlay .hmm-card__excerpt { color: rgba(255,255,255,.85); font-size: 12px; margin: 6px 0 0; }
/* Fond coloré de la zone texte overlay (option card_body_bg) */
/* S'applique seulement sur overlay-band (pas de gradient propre) */
.hmm-card__overlay--overlay-band.hmm-card__overlay--body-bg {
  background: var(--hmm-card-overlay-bg, rgba(0,0,0,.7)) !important;
  padding: 14px 16px !important;
  border-radius: 0 0 var(--hmm-radius, 8px) var(--hmm-radius, 8px);
}
/* Pour overlay-dark et overlay-badge : body-bg s'ajoute au gradient existant */
.hmm-card__overlay--overlay-dark.hmm-card__overlay--body-bg,
.hmm-card__overlay--overlay-badge.hmm-card__overlay--body-bg {
  padding: 14px 16px !important;
}
.hmm-card__overlay .hmm-meta { margin-bottom: 4px; }
.hmm-card--overlay:hover .hmm-img { transform: scale(1.06); }

/* ─── Listes ────────────────────────────────────────── */
.hmm-card--list {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 14px !important;
  padding: 12px 0 !important;
  border-bottom: 1px solid var(--hmm-border, #e9ecef);
  border-radius: 0 !important;
  background: transparent !important;
  overflow: visible !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
.hmm-card--list:last-child { border-bottom: none; }
/* Image liste — flex-shrink:0 pour qu'elle ne se réduise pas */
.hmm-card--list .hmm-img-wrap,
.hmm-card--list .hmm-list__thumb {
  flex-shrink: 0 !important;
  /* La largeur est définie en inline par PHP — fallback CSS seulement */
  min-width: 80px;
  border-radius: var(--hmm-radius) !important;
  overflow: hidden !important;
}
.hmm-card--list .hmm-img-wrap .hmm-img,
.hmm-card--list .hmm-list__thumb .hmm-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}
.hmm-card--list.hmm-card--list-right { flex-direction: row-reverse !important; }
.hmm-card--list .hmm-card__body { padding: 0 !important; flex: 1 !important; min-width: 0 !important; }
.hmm-card--list .hmm-card__title { font-size: 14px; margin-bottom: 6px; }

.hmm-card--compact {
  padding: 10px 0;
  border-bottom: 1px solid var(--hmm-border, #e9ecef);
  border-radius: 0;
  background: transparent;
  overflow: visible;
}
.hmm-card--compact:last-child { border-bottom: none; }
.hmm-card--compact .hmm-card__body { padding: 0; }
.hmm-card--compact .hmm-card__title { font-size: 14px; }

/* ─── Mix layouts ───────────────────────────────────── */
.hmm-grid--mix-1-3 .hmm-grid__items { grid-template-columns: 1fr 1fr 1fr; }
.hmm-grid--mix-1-3 .hmm-grid__item:first-child { grid-column: 1 / -1; }
.hmm-grid--mix-1-3 .hmm-grid__item:first-child .hmm-card__title { font-size: 22px; }

.hmm-grid--mix-hero-right .hmm-grid__items { grid-template-columns: 3fr 2fr; }
.hmm-grid--mix-hero-right .hmm-grid__item:first-child { grid-column: 1; grid-row: 1 / span 99; }
.hmm-grid--mix-hero-right .hmm-grid__item:not(:first-child) { grid-column: 2; }

.hmm-grid--mix-2-4 .hmm-grid__items { grid-template-columns: repeat(4, 1fr); }
.hmm-grid--mix-2-4 .hmm-grid__item:nth-child(1),
.hmm-grid--mix-2-4 .hmm-grid__item:nth-child(2) { grid-column: span 2; }
.hmm-grid--mix-2-4 .hmm-grid__item:nth-child(1) .hmm-card__title,
.hmm-grid--mix-2-4 .hmm-grid__item:nth-child(2) .hmm-card__title { font-size: 18px; }

.hmm-grid--masonry .hmm-grid__items {
  display: block;
  column-count: var(--hmm-cols, 3);
  column-gap: var(--hmm-gap, 24px);
}
.hmm-grid--masonry .hmm-grid__item {
  break-inside: avoid;
  margin-bottom: var(--hmm-gap, 24px);
  display: block;
}

/* ─── Séparateurs presse ────────────────────────────── */
/* Layouts liste — override le CSS grid pour affichage vertical */
/* Layouts liste image — une carte par ligne (flex horizontal) */
.hmm-grid--list-left .hmm-grid__items,
.hmm-grid--list-right .hmm-grid__items {
  display: block !important;
  column-count: unset !important;
  grid-template-columns: unset !important;
}
/* list-compact : grille N colonnes — utilise le grid standard */
.hmm-grid--list-compact .hmm-grid__items {
  display: grid !important;
  column-count: unset !important;
}

/* ─── Séparateurs entre articles ───────────────────── */
/* Vertical : trait entre les colonnes */
.hmm-grid--divider-v .hmm-grid__items {
  column-gap: 0 !important;
}
.hmm-grid--divider-v .hmm-grid__item {
  position: relative;
  padding-right: calc(var(--hmm-gap, 24px) / 2) !important;
  padding-left: calc(var(--hmm-gap, 24px) / 2) !important;
}
.hmm-grid--divider-v .hmm-grid__item:first-child { padding-left: 0 !important; }
/* Le trait est un ::after positionné à droite de l'item, entre les colonnes */
.hmm-grid--divider-v .hmm-grid__item::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: var(--hmm-divider-width, 1px);
  height: 100%;
  background: var(--hmm-divider-color, #e9ecef);
}
/* Pas de trait sur le dernier item de chaque ligne */
.hmm-grid--divider-v .hmm-grid__item:last-child::after,
.hmm-grid--divider-v .hmm-grid__item:nth-child(var(--hmm-cols))::after { display: none; }

/* Horizontal : trait entre les rangées */
.hmm-grid--divider-h .hmm-grid__item {
  padding-bottom: calc(var(--hmm-gap, 24px) / 2) !important;
  padding-top: calc(var(--hmm-gap, 24px) / 2) !important;
  position: relative;
}
.hmm-grid--divider-h .hmm-grid__item::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: var(--hmm-divider-width, 1px);
  background: var(--hmm-divider-color, #e9ecef);
}
/* Both : vertical + horizontal */
.hmm-grid--divider-both .hmm-grid__item {
  position: relative;
  padding: calc(var(--hmm-gap, 24px) / 2) !important;
}
.hmm-grid--divider-both .hmm-grid__item::after {
  content: '';
  position: absolute;
  top: 0; right: 0;
  width: var(--hmm-divider-width, 1px);
  height: 100%;
  background: var(--hmm-divider-color, #e9ecef);
}
.hmm-grid--divider-both .hmm-grid__item::before {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: var(--hmm-divider-width, 1px);
  background: var(--hmm-divider-color, #e9ecef);
}

/* ─── Layouts Magazine ──────────────────────────────── */

/* ── Règles communes aux layouts magazine ── */
.hmm-grid--mag-2col .hmm-grid__items,
.hmm-grid--mag-4vign .hmm-grid__items,
.hmm-grid--mag-featured-grid3 .hmm-grid__items,
.hmm-grid--mag-featured-grid4 .hmm-grid__items {
  display: grid;
  align-items: start;
}

/* Séparateur vertical entre vedette et vignettes */
.hmm-grid--mag-2col .hmm-item-1,
.hmm-grid--mag-4vign .hmm-item-5 {
  border-right: 1px solid var(--hmm-border, #e9ecef);
}
.hmm-grid--mag-4vign .hmm-item-5 {
  border-right: none;
  border-left: 1px solid var(--hmm-border, #e9ecef);
}

/* ── mag-2col : vedette gauche + grille 2×2 droite (Image 1) ── */
/* Vedette : grande image + titre grand + extrait */
.hmm-grid--mag-2col .hmm-item-1 .hmm-card__title { font-size: 22px; font-weight: 800; line-height: 1.2; }
/* Vignettes : cartes compactes */
.hmm-grid--mag-2col .hmm-item-2 .hmm-card__title,
.hmm-grid--mag-2col .hmm-item-3 .hmm-card__title,
.hmm-grid--mag-2col .hmm-item-4 .hmm-card__title,
.hmm-grid--mag-2col .hmm-item-5 .hmm-card__title { font-size: 14px; font-weight: 700; }
/* Séparateurs entre vignettes */
.hmm-grid--mag-2col .hmm-item-2,
.hmm-grid--mag-2col .hmm-item-3 { border-bottom: 1px solid var(--hmm-border, #e9ecef); padding-bottom: var(--hmm-gap, 24px); }

/* ── mag-4vign : grille 2×2 gauche + vedette droite (Image 2) ── */
.hmm-grid--mag-4vign .hmm-item-5 .hmm-card__title,
.hmm-grid--mag-4vign .hmm-item-6 .hmm-card__title { font-size: 22px; font-weight: 800; line-height: 1.2; }
.hmm-grid--mag-4vign .hmm-item-1 .hmm-card__title,
.hmm-grid--mag-4vign .hmm-item-2 .hmm-card__title,
.hmm-grid--mag-4vign .hmm-item-3 .hmm-card__title,
.hmm-grid--mag-4vign .hmm-item-4 .hmm-card__title { font-size: 14px; font-weight: 700; }
.hmm-grid--mag-4vign .hmm-item-1,
.hmm-grid--mag-4vign .hmm-item-2 {
  border-bottom: 1px solid var(--hmm-border, #e9ecef);
  padding-bottom: var(--hmm-gap, 24px);
  margin-bottom: calc(var(--hmm-gap, 24px) / 2);
}

/* ── mag-featured-grid4 : vedette pleine + grille 4col ── */
.hmm-grid--mag-featured-grid4 .hmm-item-1 .hmm-img-wrap { flex: 0 0 50%; overflow: hidden; border-radius: var(--hmm-radius); }
.hmm-grid--mag-featured-grid4 .hmm-item-1 .hmm-card__body { flex: 1; padding: 8px var(--hmm-gap,24px) 16px var(--hmm-gap,24px); display: flex; flex-direction: column; justify-content: center; }
.hmm-grid--mag-featured-grid4 .hmm-item-1 .hmm-card__title { font-size: 26px; font-weight: 800; }

/* ── mag-featured-grid3 : vedette pleine + grille 3col ── */
.hmm-grid--mag-featured-grid3 .hmm-item-1 .hmm-img-wrap { flex: 0 0 48%; overflow: hidden; border-radius: var(--hmm-radius); }
.hmm-grid--mag-featured-grid3 .hmm-item-1 .hmm-card__body { flex: 1; padding: 8px var(--hmm-gap,24px) 16px var(--hmm-gap,24px); display: flex; flex-direction: column; justify-content: center; }
.hmm-grid--mag-featured-grid3 .hmm-item-1 .hmm-card__title { font-size: 26px; font-weight: 800; }

/* ── Égalisation hauteur dans les layouts magazine featured-grid ── */
/* Le grid magazine a `align-items: start` par défaut pour permettre la
   carte vedette d'occuper sa hauteur naturelle. Mais quand equal_height
   est activé, les vignettes (item 2-9) doivent s'étirer pour avoir
   la même hauteur entre elles, sinon les rangées paraissent décousues. */
.hmm-grid--equal-height.hmm-grid--mag-featured-grid4 .hmm-grid__items,
.hmm-grid--equal-height.hmm-grid--mag-featured-grid3 .hmm-grid__items {
  align-items: stretch;
}
.hmm-grid--equal-height.hmm-grid--mag-featured-grid4 .hmm-grid__item:not(.hmm-item-1),
.hmm-grid--equal-height.hmm-grid--mag-featured-grid3 .hmm-grid__item:not(.hmm-item-1) {
  display: flex;
  flex-direction: column;
}
.hmm-grid--equal-height.hmm-grid--mag-featured-grid4 .hmm-grid__item:not(.hmm-item-1) .hmm-card,
.hmm-grid--equal-height.hmm-grid--mag-featured-grid3 .hmm-grid__item:not(.hmm-item-1) .hmm-card {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.hmm-grid--equal-height.hmm-grid--mag-featured-grid4 .hmm-grid__item:not(.hmm-item-1) .hmm-card__body,
.hmm-grid--equal-height.hmm-grid--mag-featured-grid3 .hmm-grid__item:not(.hmm-item-1) .hmm-card__body {
  flex: 1;
  display: flex;
  flex-direction: column;
}
/* Bouton "Lire la suite" et compteurs en bas grâce à margin-top: auto */
.hmm-grid--equal-height.hmm-grid--mag-featured-grid4 .hmm-grid__item:not(.hmm-item-1) .hmm-read-more,
.hmm-grid--equal-height.hmm-grid--mag-featured-grid4 .hmm-grid__item:not(.hmm-item-1) .hmm-inter,
.hmm-grid--equal-height.hmm-grid--mag-featured-grid3 .hmm-grid__item:not(.hmm-item-1) .hmm-read-more,
.hmm-grid--equal-height.hmm-grid--mag-featured-grid3 .hmm-grid__item:not(.hmm-item-1) .hmm-inter {
  margin-top: auto;
}

/* ─── Responsive ────────────────────────────────────── */
@media (max-width: 1199px) {
  .hmm-grid--grid-6 .hmm-grid__items { --hmm-cols: 3; }
  .hmm-grid--grid-5 .hmm-grid__items { --hmm-cols: 3; }
}
@media (max-width: 991px) {
  .hmm-grid--grid-4 .hmm-grid__items,
  .hmm-grid--grid-5 .hmm-grid__items,
  .hmm-grid--grid-6 .hmm-grid__items { --hmm-cols: 2; }
  .hmm-grid--mix-hero-right .hmm-grid__items { grid-template-columns: 1fr 1fr ; }
  .hmm-grid--mix-hero-right .hmm-grid__item:first-child { grid-row: auto; }
}
@media (max-width: 767px) {
  .hmm-grid--grid-3 .hmm-grid__items,
  .hmm-grid--grid-4 .hmm-grid__items,
  .hmm-grid--grid-5 .hmm-grid__items,
  .hmm-grid--grid-6 .hmm-grid__items { --hmm-cols: 2; }
  .hmm-grid--mix-1-3 .hmm-grid__items { grid-template-columns: 1fr 1fr ; }
  .hmm-grid--mix-hero-right .hmm-grid__items,
  .hmm-grid--mix-2-4 .hmm-grid__items { grid-template-columns: 1fr 1fr ; }
  .hmm-grid--mix-2-4 .hmm-grid__item:nth-child(1),
  .hmm-grid--mix-2-4 .hmm-grid__item:nth-child(2) { grid-column: span 1; }
  .hmm-card--list .hmm-img-wrap { width: 90px; }
  .hmm-card--list-large-left .hmm-img-wrap { width: 140px; }
}
@media (max-width: 479px) {
  .hmm-grid__items { --hmm-cols: 1 !important; }
  .hmm-grid--mix-1-3 .hmm-grid__item:first-child { grid-column: auto; }
  .hmm-card--list .hmm-img-wrap { width: 80px; }
}


/* ═══════════════════════════════════════════════════════════════════
   BORDURE DE CARTE (style page Auteur)
   Activée via la classe .hmm-grid--card-bordered sur le wrapper.
   Variables fournies inline par le shortcode :
     --hmm-card-border-color, --hmm-card-border-width, --hmm-card-border-radius
   ═══════════════════════════════════════════════════════════════════ */
.hmm-grid--card-bordered {
  --hmm-card-border-color: #e5e7eb;
  --hmm-card-border-width: 1px;
  --hmm-card-border-radius: 10px;
}

.hmm-grid--card-bordered .hmm-card {
  border: var(--hmm-card-border-width, 1px) solid var(--hmm-card-border-color, #e5e7eb) !important;
  border-radius: var(--hmm-card-border-radius, 10px);
  overflow: hidden;
  background: var(--hmm-card-bg, #ffffff);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

/* Image : hérite du radius haut comme la page Auteur */
.hmm-grid--card-bordered .hmm-card > .hmm-img-wrap:first-child,
.hmm-grid--card-bordered .hmm-card > a > .hmm-img-wrap:first-child {
  border-radius: var(--hmm-card-border-radius, 10px) var(--hmm-card-border-radius, 10px) 0 0;
}

/* Ombre portée optionnelle */
.hmm-grid--card-shadow .hmm-card {
  box-shadow: 0 2px 8px rgba(26, 74, 156, 0.08);
}

/* Hover — Élévation (style page Auteur) */
.hmm-grid--card-hover-lift .hmm-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(26, 74, 156, 0.12);
}

/* Hover — Bordure accent */
.hmm-grid--card-hover-accent .hmm-card:hover {
  border-color: var(--hmm-accent, #1a4a9c);
}

/* Variantes liste : la bordure horizontale interne devient la bordure de carte */
.hmm-grid--card-bordered .hmm-card--list,
.hmm-grid--card-bordered .hmm-card--list-large-left,
.hmm-grid--card-bordered .hmm-card--list-compact,
.hmm-grid--card-bordered .hmm-card--list-bordered {
  border-bottom: var(--hmm-card-border-width, 1px) solid var(--hmm-card-border-color, #e5e7eb) !important;
}