/**
 * Carte partenaire — bloc logo blanc puis bloc texte coloré.
 *
 * Figma : carte 418 × 476 px, zone logo 196 px (41 %), corps 280 px (59 %).
 * La hauteur n'est jamais fixée ici : les cartes s'égalisent via le parent
 * (grille ou piste de carousel), ce qui absorbe les descriptions de longueurs
 * différentes (Figma : 108, 120 et 140 px).
 *
 * Emplacement : assets/css/components/card-partenaire.css
 */

.card-partenaire {
	/* width autant que height : la carte est posée dans un conteneur flex qui
	   lui laisse sa largeur de colonne, mais sans cette déclaration elle se
	   dimensionne sur son contenu. Une photographie étroite rétrécissait alors
	   toute la carte, et la rangée perdait son alignement. */
	width: 100%;
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	background-color: var(--color-surface);
	border-radius: var(--radius-lg);
}

/* ── Zone logo ─────────────────────────────────────────────── */

/* flex: none + min-height: 0 sont indispensables : sans eux, la zone est un
   élément flex en min-height auto, elle s'étire donc à la hauteur du logo le
   plus haut (un logo carré fait doubler sa carte) et l'aspect-ratio n'est plus
   respecté. Avec une hauteur devenue définie, le logo peut s'y caler. */
.card-partenaire__media {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	min-height: 0;
	aspect-ratio: 418 / 196;   /* proportions Figma, indépendantes de la largeur */
	padding: var(--space-6);
	overflow: hidden;
	background-color: var(--color-surface);
}

/* ── Portrait du promoteur ─────────────────────────────────

   Le contraire d'un logo : il remplit son cadre au lieu d'y tenir. Le
   catalogue ivoirien n'a livré que des photographies, et les rapetisser au
   centre d'un aplat crème les réduisait à des timbres.

   Cadrage au tiers supérieur, relevé sur les 46 portraits du catalogue. Le
   « top » d'origine partait du principe que le visage touche le bord haut ;
   c'est faux pour les portraits verticaux, nombreux ici (533 × 800, 476 × 800),
   où la bande visible ne mesure qu'un quart de la hauteur et n'attrapait que
   des cheveux. À 30 %, un seul cliché reste mal cadré, et aucune valeur ne le
   sauve : Entreprise Eyokon est un 360 × 800 où le visage occupe tout. */
.card-partenaire__media--portrait {
	padding: 0;
}

.card-partenaire__portrait {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 30%;
}

/* ── Repli : la marque en filigrane ────────────────────────

   Ni logo ni portrait. La marque E4Y posée en clair se lit « logo à venir »
   plutôt que « logo de cette entreprise » — un aplat vide, lui, passe pour un
   défaut d'affichage. */
.card-partenaire__marque {
	width: 40%;
	max-width: 84px;
	height: auto;
	opacity: 0.16;
}

/* object-fit fait le cadrage : quel que soit le format du fichier fourni,
   le logo occupe la même boîte que les autres, sans déformation. */
.card-partenaire__logo {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* ── Bloc coloré ───────────────────────────────────────────── */

.card-partenaire__corps {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: var(--space-4);       /* Figma : ~17 px entre le titre et le texte */
	/* Bas plus généreux que le haut : Figma laisse 36 px au-dessus du titre et
	   au minimum 58 px sous la description la plus longue. */
	padding: var(--space-6) var(--space-5) var(--space-7);
	text-align: center;
}

.card-partenaire__titre {
	font-size: var(--fs-h3);   /* Figma : 24 px */
	color: var(--color-text-inverse);
}

.card-partenaire__desc {
	font-size: var(--fs-body);
	line-height: var(--lh-heading);  /* Figma : 1.28 */
	color: var(--color-text-inverse);
}

.card-partenaire__bouton {
	align-self: center;
	margin-block-start: auto;   /* collé au bas, quelle que soit la longueur du texte */
}

/* ── Fond du média ─────────────────────────────────────────── */

/* Crème sur la page Programme, blanc sur le consortium (Figma). */
.card-partenaire--media-creme,
.card-partenaire--media-creme .card-partenaire__media {
	background-color: var(--color-bg);
}

/* Plusieurs logos de participants arrivent avec un fond blanc opaque, qui
   trancherait sur le crème. Le fondu « obscurcir » l'efface sans toucher à
   l'encre, toujours plus sombre que le crème — et reste sans effet sur les
   logos déjà détourés, un pixel transparent n'ayant rien à obscurcir. */
.card-partenaire--media-creme .card-partenaire__logo {
	mix-blend-mode: darken;
}

/* ── Variantes de couleur ──────────────────────────────────── */

.card-partenaire--orange .card-partenaire__corps {
	background-color: var(--card-orange-bg);
}

.card-partenaire--gold .card-partenaire__corps {
	background-color: var(--card-gold-bg);
}

.card-partenaire--green .card-partenaire__corps {
	background-color: var(--card-green-bg);
}