/* ===============================
    CSS POUR TOUTE PAGE WP
   =============================== */

/* Liens globaux */
a {
    color: #0066cc;   /* bleu standard autonome, modifiable ensuite */
}

/* Sécurité : éviter les conflits globaux */
* {
    box-sizing: border-box;
}

/* TEST PAGES.CSS XXXX */
#primary {
   // border: 8px solid red;
   // padding: 20px;
}



/*  https://mg.n0c.com  */

/* FOND COLORE CHANGE */
@keyframes bgShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.animated-bg {
  background: linear-gradient(
    -45deg,							/* mouvement */
    #00ff87,   /* vert vif */
    #00c9a7,   /* vert aqua */
    #007cf0,   /* bleu pur */
    #00ff87    /* vert vif */
  );
  background-size: 300% 300%;
  animation: bgShift 18s ease infinite;
}
/* drapeau ukraine non-animé */
.animated-bg-2 {
  background: linear-gradient(
    #ffd700,   /* jaune vif */
    #007cf0,   /* bleu */
    #ffd700,
    #007cf0
  );
  background-size: 300% 300%;
  animation: bgShift 30s ease infinite;
}
/* ciel de provence */
.animated-bg-3 {
  background: linear-gradient(
    -45deg,
    #87cefa,   /* bleu ciel clair */
    #0077ff,   /* bleu ciel profond */
    #fff176,   /* jaune soleil doux */
    #87cefa,   /* bleu ciel */
    #0077ff    /* bleu dominant */
  );
  background-size: 300% 300%;
  animation: bgShift 25s ease infinite;
}
/* effet plus chaud 
effet encore plus réaliste = ralentir légèrement : animation: bgShift 35s ease infinite;
*/
.animated-bg-4 {
  background: linear-gradient(
    -45deg,
	#b3e5fc,
	#2196f3,
	#fff59d,
	#b3e5fc,
	#1e88e5
  );
  background-size: 300% 300%;
  animation: bgShift 35s ease infinite;
}

.text-gradient {
  background: linear-gradient(
    -45deg,
    #0b3d91,   /* bleu profond */
    #0077ff,   /* bleu lumineux */
    #00a86b,   /* vert moyen équilibré */
    #0b3d91
  );
  background-size: 300% 300%;
  animation: bgShift 28s ease infinite;

  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}



/* TEXTE CLIGNOTE */
@keyframes clignote {
  0%, 50%, 100% { opacity: 1; }  /* visible */
  25%, 75% { opacity: 0; }       /* invisible */
}
.clignotant {
  animation: clignote 1s infinite; /* 1s pour un cycle complet, répété à l’infini */
/*  color: #0184F8;                  /* couleur du texte */
  font-weight: bold;
}


@keyframes clignote2 {
  0%, 49% { visibility: visible; }
  50%, 100% { visibility: hidden; }
}
.clignotant2 {
  animation: clignote2 2s steps(1, end) infinite;
}





/* TEXTE OSCILLANT EN COULEUR */
@keyframes oscilleCouleur {
  0%   { color: #000000; } 
  50%  { color: #F6821F; } 	/*   orange logo #F6821F  bleu:  #4551D1 */
  100% { color: #000000; } 
}
.oscillant {
  animation: oscilleCouleur 2s infinite; /* 2s pour un cycle complet */
  // font-weight: bold;
}
@keyframes partirCouleur {
  0%   { color: #000000; } 
  50%  { color: transparent; } 	
  100% { color: #000000; } 
}
.partir {
  animation: partirCouleur 3s infinite; 
  // font-weight: bold;
}