/* ADAM — marque, source UNIQUE de la mise à l'échelle.
   Servi statiquement à /brand/brand.css et consommé par les DEUX mondes :
   - le bundle React, via <link> dans index.html (markup : <BrandLogo />) ;
   - public/new-era/index.html, hors du graphe de modules Vite.
   Ne JAMAIS recopier ces règles dans un CSS local.

   ══════════════════════════════════════════════════════════════════════
   LES SVG SONT DÉSORMAIS RECADRÉS — LA CSS N'A PLUS À RATTRAPER
   ══════════════════════════════════════════════════════════════════════

   Les exports Canva arrivaient dans un viewBox CARRÉ de 375 × 375 alors que
   le tracé n'occupait qu'une bande centrale : en `height: 1em`, le logo
   visible ne faisait qu'un quart de la hauteur demandée. On compensait avec
   une boîte au ratio du contenu et `object-fit: cover`.

   Ce rattrapage a disparu : les fichiers ont été recadrés À LA SOURCE (voir
   le rapport de nettoyage). Leur viewBox colle maintenant au tracé, à 2
   unités de marge de sécurité près. `height` + `width: auto` suffit donc, et
   c'est le ratio INTRINSÈQUE du fichier qui pilote la largeur — plus de
   recadrage, plus de valeur à maintenir en double.

   Il reste une seule conversion : la marge de sécurité. Le tracé occupe
   `--*-remplissage` de la hauteur du viewBox ; on divise par ce taux pour
   que `1em` vaille la hauteur VISIBLE du tracé, et pas celle de la boîte.

   Mesures au rendu (canal alpha) sur les fichiers où les aplats opaques ont
   été convertis en VRAIE découpe (masque) — le dessin d'origine est intact,
   seuls les espaces négatifs sont devenus transparents :
       Logo   viewBox 337,750 × 102,571   tracé 333,750 × 98,571
       Symbol viewBox 337,750 ×  72,839   tracé 333,750 × 68,839
   Les variantes claire et sombre partagent désormais EXACTEMENT la même
   boîte : le fragment blanc orphelin qui élargissait la variante claire a
   été supprimé. Un seul ratio suffit donc, sans surcharge par thème.

   Le ratio est défini par thème : les deux variantes ne coïncident pas au
   millième, et une seule valeur ferait changer le logo de taille à la
   bascule. L'écart est tombé de 5 % à 0,6 % avec le nettoyage.

   Couleur : elle est DANS le fichier (blanc pour l'UI sombre, noir pour l'UI
   claire, signature turquoise du M dans les deux). Jamais de `filter`,
   jamais de recoloration. Violet, bleu et cyan restent les accents de la
   marque et ne servent qu'aux halos posés DERRIÈRE le logo. */

:root {
  --brand-logo-ratio: 337.750 / 102.571;
  --brand-logo-remplissage: 0.961;
  --brand-symbole-ratio: 337.750 / 72.839;
  --brand-symbole-remplissage: 0.945;
}

.brand-lockup {
  display: inline-flex;
  align-items: center;
  gap: 0.43em;
  line-height: 1;
  text-decoration: none;
}

.brand-full,
.brand-symbol {
  display: block;
  width: auto;           /* le ratio intrinsèque du fichier fait le reste */
  -webkit-user-drag: none;
}

/* LOGO COMPLET (ADAM + TRADING TERMINAL) — hero, accueils statiques.
   1em = hauteur VISIBLE du bloc entier, sous-titre compris. */
.brand-full { height: calc(1em / var(--brand-logo-remplissage)); }

/* SYMBOLE (ADAM seul) — barres, pied de page, filigrane, 404.
   1em = hauteur VISIBLE du mot. */
.brand-symbol { height: calc(1em / var(--brand-symbole-remplissage)); }

/* Variante « mark » : calée sur la hauteur de capitale d'Inter (0,74em)
   pour ne déplacer aucun alignement existant. */
.brand-symbol--mark { height: calc(0.74em / var(--brand-symbole-remplissage)); }

/* Variante automatique Light/Dark. Les DEUX fichiers officiels sont dans le
   DOM afin que le choix soit déjà possible dans le HTML pré-rendu, avant que
   React ne s'hydrate. La classe `light` est posée sur <html> par le bootstrap
   inline d'index.html avant le premier paint. */
.brand-theme-logo {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  line-height: 1;
}
.brand-theme-logo > .brand-theme-logo__light { display: none; }
html.light .brand-theme-logo > .brand-theme-logo__dark { display: none; }
html.light .brand-theme-logo > .brand-theme-logo__light { display: block; }

/* Conservé pour tout markup tiers. Ne pas s'en servir pour recomposer le
   logo : le mot est dans le fichier. */
.brand-word {
  font-family: 'Inter', sans-serif;
  font-size: 1em;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1;
  color: var(--brand-word-color, #e2ecff);
}
