/* Cartes éleveur : partagées par /eleveurs/<race>.html ET le bloc « Trouver un éleveur » des fiches races.
   En production : /assets/eleveurs.css (nom versionné : cache 1 an). */
/* ---------- Carte éleveur (3 niveaux de visibilité) ---------- */
.el-card {
  background: var(--white); border: 1px solid var(--rule); border-radius: 18px;
  box-shadow: 0 8px 30px rgba(30,30,30,.05); overflow: hidden; margin-bottom: 12px;
}
.el-card.filtre-cache { display: none; }
.el-body { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 24px; align-items: center; padding: 18px 20px; }
.el-info { grid-column: 1; grid-row: 1; min-width: 0; }
.el-act { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; align-self: center; grid-column: 2; grid-row: 1; }
.el-photo img { display: block; object-fit: cover; }

.el-band { display: flex; align-items: center; gap: 8px; background: var(--sage); color: var(--forest); font-weight: 700; border-bottom: 1px solid rgba(74, 100, 70, 0.2); }
.el-band .ic { width: 14px; height: 14px; stroke-width: 2; }
.el-band .ic.star { fill: currentColor; }

/* Partenaire : bandeau discret, bordure, vignette */
.el-card.tier-partner { border-color: rgba(74, 100, 70, 0.4); }
.el-card.tier-partner .el-band { font-size: 0.72rem; padding: 5px 20px; }
.el-card.tier-partner.has-photo .el-body { grid-template-columns: 190px minmax(0, 1fr) auto; padding: 0 20px 0 0; }
.el-card.tier-partner .el-photo { grid-column: 1; grid-row: 1; align-self: stretch; }
.el-card.tier-partner .el-photo img { width: 100%; height: 100%; min-height: 190px; }
.el-card.tier-partner.has-photo .el-info { grid-column: 2; padding: 18px 0; }
.el-card.tier-partner.has-photo .el-act { grid-column: 3; }

/* Payant : bandeau plein, grande photo, fond teinté, bordure marquée, ombre teintée */
.el-card.tier-paid {
  border: 1.5px solid var(--forest);
  background: color-mix(in srgb, var(--sage) 30%, var(--white));
  box-shadow: 0 14px 40px rgba(74, 100, 70, 0.2);
}
.el-card.tier-paid .el-band { font-size: 0.78rem; padding: 8px 20px; }
.el-card.tier-paid.has-photo .el-body { grid-template-columns: 260px minmax(0, 1fr) auto; padding: 0 22px 0 0; }
.el-card.tier-paid .el-photo { grid-column: 1; grid-row: 1; align-self: stretch; }
.el-gallery { display: flex; flex-direction: column; gap: 3px; height: 100%; }
.el-gallery .main { flex: 1 1 auto; min-height: 220px; overflow: hidden; }
.el-gallery .main img { width: 100%; height: 100%; }
.el-gallery .thumbs { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: minmax(0, 1fr); gap: 3px; height: 96px; overflow: hidden; }
.el-gallery .thumbs img { width: 100%; height: 100%; min-height: 0; }
.el-card.tier-paid.has-photo .el-info { grid-column: 2; padding: 20px 0; }
.el-card.tier-paid.has-photo .el-act { grid-column: 3; }
.el-card.tier-paid h3 { font-size: 1.14rem; }
.el-card.tier-paid .el-act .btn { height: 46px; padding: 0 22px; }
.el-card.tier-paid .el-tag { background: var(--white); }

.el-card h3 { font-family: 'Inter', sans-serif; font-size: 1.02rem; font-weight: 600; color: var(--ink); margin: 0; }
.el-where { display: flex; align-items: center; gap: 6px; font-size: 0.84rem; color: var(--muted); margin: 3px 0 0; }
.el-where .ic { width: 14px; height: 14px; }
.el-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0; }
.el-tag { background: var(--cream-2); border: 1px solid var(--rule); color: var(--text); font-size: 0.72rem; font-weight: 600; padding: 2px 10px; border-radius: 20px; }
.el-desc { font-size: 0.9rem; margin: 10px 0 0; max-width: 62ch; }
.el-tests { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 10px 0 0; padding: 0; list-style: none; font-size: 0.82rem; color: var(--text); }
.el-tests li { display: inline-flex; align-items: center; gap: 6px; }
.el-tests .ic { width: 14px; height: 14px; color: var(--forest); stroke-width: 2.2; }
.el-tests .lbl { color: var(--muted); }
.el-act .btn { height: 42px; padding: 0 18px; font-size: 0.86rem; border-radius: 12px; }
.el-act .btn .ic { width: 15px; height: 15px; }

@media (max-width: 640px) {
  .el-body, .el-card.tier-partner.has-photo .el-body, .el-card.tier-paid.has-photo .el-body { grid-template-columns: 1fr; padding: 16px; }
  /* sans photo : texte (ligne 1), bouton (ligne 2) */
  .el-info { grid-column: 1; grid-row: 1; padding: 0; }
  .el-act { grid-column: 1; grid-row: 2; flex-direction: row; justify-content: space-between; align-items: center; margin-top: 4px; }
  /* avec photo : photo (ligne 1, pleine largeur), texte (ligne 2), bouton (ligne 3).
     Même spécificité que les règles bureau .tier-x.has-photo, sinon elles l'emportent. */
  .el-card.tier-partner.has-photo .el-photo, .el-card.tier-paid.has-photo .el-photo { grid-column: 1; grid-row: 1; margin: -16px -16px 4px; align-self: auto; }
  .el-card.tier-partner.has-photo .el-info, .el-card.tier-paid.has-photo .el-info { grid-column: 1; grid-row: 2; padding: 0; }
  .el-card.tier-partner.has-photo .el-act, .el-card.tier-paid.has-photo .el-act { grid-column: 1; grid-row: 3; flex-direction: row; justify-content: space-between; align-items: center; margin-top: 4px; }
  .el-card.tier-partner .el-photo img { width: 100%; height: 130px; min-height: 0; border-radius: 0; }
  .el-gallery { height: auto; }
  .el-gallery .main { flex: none; height: 200px; min-height: 0; }
  .el-gallery .thumbs { height: 90px; }
  .el-band, .el-card.tier-partner .el-band, .el-card.tier-paid .el-band { padding-left: 16px; padding-right: 16px; }
}

.el-empty { display: none; color: var(--muted); padding: 16px 0; }
.el-empty.visible { display: block; }

/* ---------- Bloc « Trouver un éleveur » (fiche race) : version compacte des cartes ---------- */
/* Dans la fiche, `order` ne s'applique qu'en mobile (≤ 960 px) : sur ordinateur c'est l'ordre du code (après le budget). */
@media (max-width: 960px) { .fiche-layout > .ef-wrap { order: 10; } }
.ef-wrap { margin-bottom: clamp(48px, 6vw, 64px); scroll-margin-top: 130px; }
.ef-wrap .block-head { margin-bottom: 8px; }
.ef-lead { margin: 0 0 16px; max-width: 70ch; }
.ef-cards { display: grid; gap: 14px; }
.ef-cards.n2 { grid-template-columns: 1fr 1fr; }
.ef-cards .el-card { margin-bottom: 0; }
.el-card.compact .el-gallery .thumbs, .el-card.compact .el-tests { display: none; }
.el-card.compact .el-desc { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.el-card.compact.tier-paid.has-photo .el-photo .el-gallery .main { min-height: 0; }
.ef-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 16px; }
.ef-foot .btn { height: 44px; padding: 0 20px; font-size: 0.9rem; }
.ef-foot .btn .ic { width: 16px; height: 16px; }
.ef-note { font-size: 0.78rem; color: var(--muted); }
/* deux sponsors : cartes verticales côte à côte */
.ef-cards.n2 .el-card.has-photo .el-body { grid-template-columns: 1fr; padding: 0; gap: 0; }
.ef-cards.n2 .el-card.has-photo .el-photo { grid-column: 1; grid-row: 1; margin: 0; }
.ef-cards.n2 .el-card.has-photo .el-photo img { width: 100%; height: 170px; border-radius: 0; }
.ef-cards.n2 .el-card.has-photo .el-gallery { height: auto; }
.ef-cards.n2 .el-card.has-photo .el-gallery .main { height: 170px; flex: none; }
.ef-cards.n2 .el-card.has-photo .el-info { grid-column: 1; grid-row: 2; padding: 16px 18px 0; }
.ef-cards.n2 .el-card.has-photo .el-act { grid-column: 1; grid-row: 3; flex-direction: row; justify-content: space-between; align-items: center; padding: 12px 18px 16px; margin: 0; }
@media (max-width: 860px) { .ef-cards.n2 { grid-template-columns: 1fr; } }

/* Carte minimale (éleveurs gratuits) : une simple ligne nom / lieu / bouton */
.el-card.tier-free .el-body { padding: 14px 20px; }