:root { --brand: #298c4f; --bg: #e7f8e7; }
  body { background: var(--bg); }
  .btn-brand { background: var(--brand); color:#fff; border-color:var(--brand); }
  .btn-brand:hover { background:#246f40; border-color:#246f40; color:#fff; }
  h1,h2,h3,h4,h5 { color: var(--brand); font-weight: 700; }    

body { font-family: Arial, sans-serif;  background-color: #e7f8e7 !important; }
    .hero { background: url("/pictures/background.png") center/cover no-repeat; color: white; text-align: center; padding: 100px 20px; }
    .section-padding { padding: 60px 20px; }
    .lang-switch { position: absolute; top: 15px; right: 20px; }
      /* Boutons personnalisés */
  .btn, 
  .btn-primary, 
  .btn-outline-secondary {
    background-color: #298c4f !important;
    border-color: #298c4f !important;
    color: #fff !important;
  }

  .btn:hover,
  .btn:focus {
    background-color: #246f40 !important; /* un peu plus foncé au hover */
    border-color: #246f40 !important;
    color: #fff !important;
  }

  /* Titres */
  h1, h2, h3, h4, h5, h6 {
    color: #298c4f !important;
  }
  
    /* Ratio d’image propre et recadrage élégant */
  .carousel-img {
    aspect-ratio: 16/9;      /* mets 4/3 si tu préfères */
    object-fit: cover;        /* couvre sans déformer */
  }
  
    .service-card {
    transition: transform 0.2s, box-shadow 0.2s;
  }
  .service-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15);
  }
    /* Icônes (Bootstrap Icons) */
  .bi {
    color: #298c4f !important;
  }
    /* Bouton flottant */
  .scroll-top {
    position: fixed;
    bottom: 1.5rem;
    right: 1.5rem;
    width: 3rem;
    height: 3rem;
    border: none;
    border-radius: 50%;
    background-color: rgba(255,255,255,0.85); /* rond blanc translucide */
    box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    cursor: pointer;
    display: none; /* masqué par défaut */
    align-items: center;
    justify-content: center;
    z-index: 9999;
  }

  /* Icône flèche */
  .scroll-top-icon {
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23298c4f' viewBox='0 0 16 16'%3E%3Cpath d='M8 3.293l5.354 5.353a.5.5 0 0 1-.708.708L8 4.707l-4.646 4.647a.5.5 0 0 1-.708-.708L8 3.293z'/%3E%3C/svg%3E");
  }

  /* Animation légère au hover */
  .scroll-top:hover {
    background-color: rgba(255,255,255,1);
    transform: translateY(-3px);
    transition: 0.2s;
  }
  
  #coordonnees h4 {
  color: #298c4f; /* même vert que ton thème */
  font-weight: 600;
}

#coordonnees p {
  margin-bottom: 0.4rem;
}
.cookie-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: rgba(255,255,255,0.98);
    box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
    z-index: 10000;
    display: none;
    padding: 1rem;
  }
  .cookie-content {
    max-width: 960px;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
  }
  .cookie-content p {
    margin: 0;
    font-size: 0.9rem;
    color: #333;
  }
  .cookie-content a {
    color: #298c4f;
    text-decoration: underline;
  }
  .btn-brand {
    background-color: #298c4f;
    color: #fff;
    border: none;
    padding: .5rem 1rem;
    border-radius: .25rem;
    cursor: pointer;
  }
  .btn-brand:hover {
    background-color: #246f40;
  }
  /* Section Clients - tailles uniformes */
    #clients .client-logo{width:150px;height:80px;background:#fff;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.06);display:flex;align-items:center;justify-content:center}
    #clients .client-logo img{max-width:120px;max-height:50px;object-fit:contain;filter:grayscale(100%);transition:filter .2s,transform .2s}
    #clients .client-logo img:hover{filter:grayscale(0%);transform:scale(1.04)}
    .badge-brand{--bs-badge-padding-x:.65em;--bs-badge-padding-y:.4em;border:1px solid #298c4f;color:#298c4f;background:rgba(41,140,79,.08)}
    
    /* Titres et boutons (déjà présents via inline <style>, mais mieux ici) */
h1,h2,h3,h4,h5 { color: var(--brand); font-weight: 700; }
.btn-brand { background-color: var(--brand); color: #fff; border-color: var(--brand); }
.btn-brand:hover { background:#246f40; border-color:#246f40; color:#fff; }

/* Icônes services en vert de marque */
.service-icon, .bi { color: var(--brand); }

/* Carousel flèches plus visibles (si tu utilises le carousel Bootstrap) */
.carousel-control-prev-icon,
.carousel-control-next-icon { filter: invert(41%) sepia(20%) saturate(1070%) hue-rotate(92deg) brightness(90%) contrast(90%); }