/* --- CONFIGURATION DES VARIABLES --- */
:root {
  /* Couleurs extraites du logo */
  --excel-green: #217346;
  --ai-purple: #6c2db1;
  --ai-violet-light: #9d50bb;
  --text-dark: #1a1a1a;
  --bg-light: #f8f9fa;
  
  /* Polices : On utilise une sans-serif géométrique pour le côté Tech */
  --font-main: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* --- STYLE GLOBAL --- */
body {
  font-family: var(--font-main);
  color: var(--text-dark);
  background-color: var(--bg-light);
  line-height: 1.6;
  display:grid;
  align-content: center;
  
}
img{
    display: flex;
    margin:auto;
    max-width: 1000px;
}
h1, h2, .company-name {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--ai-purple);
}

/* --- BOUTON AVEC EFFET SLIDE DÉGRADÉ --- */
.btn-amilink {
  position: relative;
  display: inline-block;
  padding: 12px 30px;
  font-size: 1rem;
  font-weight: 600;
  color: #ffffff;
  text-decoration: none;
  border: none;
  border-radius: 4px;
  overflow: hidden; /* Important pour l'effet de slide */
  background-color: var(--excel-green); /* Couleur de base (Départ) */
  transition: color 0.4s ease;
  z-index: 1;
  cursor: pointer;
}

/* Le calque de dégradé qui va slider */
.btn-amilink::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%; /* Caché sur la gauche */
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, var(--excel-green), var(--ai-purple));
  transition: left 0.5s cubic-bezier(0.25, 1, 0.5, 1);
  z-index: -1;
}

/* Effet au survol (Hover) */
.btn-amilink:hover {
  color: #fff;
}

.btn-amilink:hover::before {
  left: 0; /* Le dégradé glisse vers la droite */
}

/* --- BARRE DE SÉPARATION (Style Logo) --- */
.separator {
  height: 3px;
  width: 100px;
  background: linear-gradient(90deg, var(--excel-green), var(--ai-purple));
  margin: 20px 0;
  border: none;
}