body { margin:0; font-family: Arial, sans-serif; }
.navbar { transition: color 0.3s ease, transform 0.3s ease; /* 👉 Animation */ display:flex; justify-content:center; height: 70px ; background-color:#004d26; align-items:flex-start ; 
    padding-top: 0px; padding-bottom: 0px; font-size:x-large; text-size-adjust: 100; position: sticky; top: 0; z-index: 1000; }
.navbar .logo img {
  background-color: white;
  width: 90px;
  height: 90px;   /* Taille du logo (à ajuster) */
  margin-right: 40px; /* Espace entre logo et Accueil */}
.navbar a, .dropdown > a { color:white; text-decoration:none; padding:20px 15px; display:block; position:relative; }
.navbar a:hover { color:#ff6600; transform: scale(1.1); /* Grossit légèrement */}
.navbar a.active::after { content:''; position:absolute; bottom:0; left:0; width:100%; height:4px; background-color:#0052cc; }
.dropdown { position:relative; }
.dropdown-content { display:none; position:absolute; background-color:#004d26; min-width:200px; z-index:1000; top:100%; left:0; }
.dropdown-content a { color:white; padding:10px 15px; display:block; text-decoration:none; }
.dropdown-content a:hover { background-color:#2600ff; }
.dropdown:hover .dropdown-content { display:block; }
.hero { background-color:#e6f2eb; padding:100px 50px; }
.hero h1 { color:#004d26; font-size:48px; margin:0 0 20px 0; }
.hero p { color:#004d26; font-size:24px; margin:0 0 30px 0; }
.btn { background-color:#004d26; color:white; padding:15px 30px; text-decoration:none; font-size:18px; display:inline-block; }
.services, .news { display:flex; justify-content:space-between; padding:50px 50px; flex-wrap:wrap; gap:40px; }
.card, .news-card { border:2px solid #004d26; border-radius:8px; width:360px; padding:20px; }
.card h3, .news-card h4 { color:#004d26; margin-top:0; }
.card p, .news-card p { color:#000; font-size:16px; }
.card .card-btn { background-color:#ff6600; color:white; padding:10px 20px; text-decoration:none; display:inline-block; margin-top:20px; }
.section { padding:50px 50px; }
.section h2 { color:#004d26; font-size:36px; margin-bottom:20px; }
.topbar { background-color:#000f4d; color:white; padding:8px 20px; font-size:14px; text-align: right;}
.bloc { display: flex; height: 150px ; background-color:#ff6600; align-items: center; padding: 20xp; }
.fade-in {
  opacity: 0;
  animation: fadeIn 2s forwards;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}




.hautlogo {
  text-align: left;
  color: rgb(255, 255, 255);
  background-color: white;
  width: 150px; /* largeur contrôlée */
  margin-left: 150px;
  margin-right: 30px;

}


/*.hautlogo p {
  color: #00BFFF; /* Bleu clair du slogan *//*
  font-style: italic;
  margin: 5px 0;
} 
*/

.baniere small {
  font-size: 18px;
  line-height:0.5;
  text-align:upright;
}




@keyframes defilement {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}




.footer {
  background-color: #014421;
  color: white;
  padding: 40px 20px 20px;
  margin-top: 30px;
}

.footer-container {
  display: flex;
  justify-content: space-between; /* espace entre les blocs */
  align-items: flex-start;
}

.footer-section {
  flex: 1;
  min-width: 200px;
}

.footer-section h3 {
  color: #FFA500;
  margin-bottom: 15px;
}

.footer-section.center {
  text-align: center;
  text-indent: 15%; /* contenu centré */
}

.footer-section.right {
  text-align: right; /* contenu aligné à droite */
}

.footer-section ul {
  list-style:none;
  padding: 0;
}

.footer-section ul li {
  margin-bottom: 8px;
}

.footer-section ul li a {
  color: white;
  text-decoration: none;
}

.footer-section ul li a:hover {
  color: #FF8C00;
}

.footer-section form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items:first flex-end; /* champ et bouton alignés à droite */
}

.footer-section input[type="email"] {
  padding: 8px;
  border: none;
  border-radius: 5px;
  width: 200px;
}

.footer-section button {
  background-color: #FFA500;
  color: white;
  border: none;
  padding: 10px;
  border-radius: 5px;
  cursor: pointer;
}

.footer-section button:hover {
  background-color: #FF8C00;
}

.footer-bottom {
  text-align: center;
  margin-top: 20px;
  border-top: 1px solid #ccc;
  padding-top: 10px;
  font-size: 14px;
}

.pulse {
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.1); }
  100% { transform: scale(1); }
}

.slide-in {
  transform: translateX(-100%);
  opacity: 0;
  animation: slideIn 1s forwards;
}

@keyframes slideIn {
  to {
    transform: translateX(0);
    opacity: 1;
  }
}