/* =============================================================================
   LA MARQUE EVA — deux briques, jamais une seule image
   =============================================================================
   Le dessin et le lettrage sont deux fichiers distincts posés côte à côte. C'est
   ce qui permet de remplacer le SEUL dessin par le logo d'un client sans toucher
   au lettrage : « EVA Virtual Assistant » est la marque du produit, pas
   l'habillage d'une box.

   Les proportions viennent du verrouillage d'origine — dessin carré, lettrage à
   78 % de sa hauteur, un blanc d'un quart de hauteur entre les deux — et elles
   s'expriment ici en multiples de --h.

   ⚠ --h ET --hl SONT TOUJOURS DES ENTIERS. Une hauteur fractionnaire place les
   arêtes horizontales à cheval sur deux rangées de pixels : le logo paraît mou
   sans qu'aucune règle ne soit fautive. C'est aussi pour ça que les fichiers
   déclarent une taille exactement proportionnelle à leur viewBox.

   ⚠ --hl NE DESCEND JAMAIS SOUS 53px sur le lettrage COMPLET : en dessous, l'œil
   de « Virtual Assistant » passe sous 8 px et le sous-titre devient une bouillie
   grise. Pour plus petit, on prend le lettrage COURT, qui n'a pas de sous-titre.
   (Le seuil valait 55 px tant que le sous-titre était en Light ; il est en Medium
   depuis, ce qui l'abaisse un peu. On garde 55 en usage, la marge ne coûte rien.)
   ============================================================================= */

.eva-marque {
    --h:  70px;                 /* côté du dessin (carré) */
    --hl: 55px;                 /* hauteur du lettrage   */
    display: inline-flex;
    align-items: center;
    gap: 18px;
    line-height: 0;             /* pas de talon de ligne sous les images */
}

.eva-marque .eva-signe {
    width: var(--h);
    height: var(--h);
    object-fit: contain;        /* un logo client hors norme reste entier, jamais déformé */
    display: block;
}

.eva-marque .eva-lettrage {
    height: var(--hl);
    width: auto;
    display: block;
}

/*  LA PLAQUE — et pourquoi elle est en verre.
    Elle n'est pas décorative : le lettrage des variantes « couleur » et « encre » est en
    bleu nuit, illisible sur les fonds sombres d'EVA. Mais un rectangle blanc OPAQUE posé
    sur une interface entièrement faite de flous de 25 px se voit comme une pièce
    rapportée — c'est ce contraste de matière qu'on lit comme « brut », voire comme du
    pixel. Alors la plaque devient du verre elle aussi : blanc translucide, son propre
    flou, une bordure d'un pixel. Le logo n'a pas bougé ; c'est son support qui a rejoint
    le reste de l'interface. */
.eva-marque {
    padding: 10px 12px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(12px) saturate(1.25);
    -webkit-backdrop-filter: blur(12px) saturate(1.25);
    border: 1px solid rgba(255, 255, 255, 0.55);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

/*  La variante blanche est déjà claire : une plaque la rendrait blanche sur blanc. */
.eva-marque.logo-blanc {
    padding: 0;
    background: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: 0;
    box-shadow: none;
}

/*  Le seul cas que la règle ci-dessus laisse à découvert : variante blanche ET logo
    client. Le lettrage blanc va bien sur le fond sombre, mais le logo du client peut
    être sombre — et il n'a plus de plaque sous lui. On lui en rend une, à lui seul. */
.eva-marque.logo-blanc.client .eva-signe {
    background: rgba(255, 255, 255, 0.90);
    border-radius: 14px;
    padding: 6px;
    box-sizing: border-box;
}

/* ---------------------------------------------------------------- emplacements */
/*  Menu latéral. 240 px disponibles (280 de menu moins les 40 de .sidebar-top) :
    70 + 18 + 124 de lettrage + 26 de plaque = 238. Ne pas agrandir sans refaire ce
    calcul — au-delà, le menu déborde. */
.marque-menu       { --h: 70px; --hl: 55px; gap: 18px; }

/*  Écran de connexion : plus de place, donc plus grand — le sous-titre y respire. */
.marque-connexion  { --h: 78px; --hl: 61px; gap: 20px; }

/*  Emplacements bas : lettrage COURT (sans sous-titre), donc aucun seuil à respecter. */
.marque-dock       { --h: 30px; --hl: 17px; gap:  8px; padding: 7px 9px;  border-radius: 11px; }
.marque-entete     { --h: 28px; --hl: 15px; gap:  7px; padding: 6px 9px;  border-radius: 10px; }
.marque-pied       { --h: 26px; --hl: 14px; gap:  7px; padding: 6px 8px;  border-radius: 10px; }