/* Utilitaires */
.container { max-width: 1100px; margin: 0 auto; padding: 0 1rem; }
:root{
  --green:#8cc63f;
  --dark:#2b2b2b;
  --muted:#6b6b6b;
  --card:#fafafa;
  --border:#e8e0d6;        /* ton chaud rappel ancien design */
  --shadow:0 10px 30px rgba(0,0,0,.06);
}

/* HERO */
/* === HERO sans fond + séparation subtile === */
.hero-pro {
  /* pas de background */
  padding: calc(var(--nav-h, 50px) + 8px) 0 64px; /* descend sous la nav + espace bas */
  position: relative;
  text-align: center;
}

.hero-pro__content h1 {
  font-size: clamp(2rem, 1.2rem + 2vw, 3rem);
  line-height: 1.15;
  margin: 0 0 .35em;
  letter-spacing: .02em;
}

.hero-pro__content p.lead {
  margin: 0;
  font-size: clamp(1rem, .9rem + .4vw, 1.15rem);
  color: #3a5230; /* vert sombre lisible */
  opacity: .9;
}

/* Ligne séparatrice en bas du héros */
.hero-pro::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: min(92%, 1100px);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(0,0,0,.12), transparent);
}

/* Petite pastille centrale (accent) sur la ligne */
.hero-pro::before {
  content: "";
  position: absolute;
  bottom: -4px;                 /* chevauche très légèrement */
  left: 50%;
  transform: translateX(-50%);
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #8cc63f;         /* vert identité */
  box-shadow: 0 0 0 4px #fff;  /* halo blanc pour rester discret sur tout fond */
}

/* === Intro Professionnels === */
/* Mise en page 2 colonnes */
.pro-intro__grid {
  display: flex;
  align-items: center;        /* centre verticalement texte et image */
  justify-content: center;
  gap: 2rem;                  /* espace entre image et texte */
  flex-wrap: wrap;            /* pour passer en colonne sur petits écrans */
  margin-top: 60px; 
}

/* Colonne image */
.pro-intro__visuel {
  flex: 1 1 45%;
  text-align: center;
}

.pro-intro__visuel img {
  max-width: 100%;
  height: auto;
}

/* Colonne texte */
.pro-intro__texte {
  flex: 1 1 45%;
  font-family: "Arial", sans-serif;
  color: #222;
  line-height: 1.6;
  max-width: 520px;
}

/* Titre */
.pro-intro__texte h2 {
  font-size: 1.6rem;
  font-weight: 700;
  margin-bottom: 0.5em;
}

.pro-intro__texte .eco {
  color: #6fa62d;
  font-weight: 700;
}

/* Paragraphes */
.pro-intro__texte p {
  margin: 0.6em 0;
  font-size: 1rem;
  color: #333;
}
.pro-intro__texte .lead {
  font-size: 1.15rem;         /* un peu plus grand */
  font-weight: 500;           /* texte plus marqué */
  color: #444;                /* gris soutenu, lisible */
  margin: 0.8em 0 1.2em;
  line-height: 1.6;
  border-left: 4px solid #f7931e; /* petit accent orange à gauche */
  padding-left: 0.8em;
}
/* Lien discret */
.pro-intro__lien {
  margin: 1em 0;
}

.link-pro {
  font-size: 1rem;
  color: #aaa;
  text-decoration: none;
  pointer-events: none; /* option : désactive clic */
}

/* Compte à rebours */
.pro-intro__count {
  font-size: 1.1rem;           /* texte un peu plus grand */
  font-weight: 600;            /* plus marqué */
  color: #2b472c;              /* vert sombre pour rappeler l'identité */
  margin-top: 1.2em;
  padding: 0.6em 1em;
  background: #f0f5f0;         /* léger fond vert clair */
  border-left: 4px solid #8cc63f; /* accent vertical */
  border-radius: 4px;
}

.pro-intro__count #count {
  font-size: 1.3rem;           /* le chiffre est plus grand */
  font-weight: 700;            /* bien visible */
  color: #f7931e;              /* orange pour attirer l’œil */
}

/* Responsive : pile l’un sous l’autre */
@media (max-width: 768px) {
  .pro-intro__grid {
    flex-direction: column;
    text-align: center;
  }
  .pro-intro__texte {
    max-width: 100%;
  }
}

/* LES + */
.pro-plus{ padding: 2rem 0 4rem; }
.pro-plus__title{
  text-align:center; line-height:1.2; margin-bottom:2rem;
  font-size: clamp(1.4rem, 2.2vw, 2rem);
}
.plus-symbol{
  display:inline-grid; place-items:center;
  width:36px; height:36px; border-radius:50%;
  background:#f49c28; color:#fff; margin-right:.5rem;
  font-weight:700;
}

/* Cartes */
.pro-cards{
  display:grid; gap:24px;
  grid-template-columns: repeat(3, 1fr);
}
.pro-card{
  background:var(--card);
  padding:1.5rem 1.25rem;
  border-radius:22px;
  border:2px solid var(--border);
  box-shadow: var(--shadow);
}
.pro-card h3{
  font-size: 1.4rem;
  font-weight: 600;
  color: #2b472c; /* vert sombre pour cohérence avec ton identité */
  margin-top: 30px;
  margin-bottom: 15px;
  text-align: center;
  position: relative;
}
.pro-card ul{ margin:0 0 1rem; padding-left:1.1rem; color:#333; }
.pro-card li{ margin:.5rem 0; line-height:1.65; }
.pro-card__badges{
  display:flex; gap:16px; align-items:center; flex-wrap:wrap;
}
.pro-card__badges img{ display: block;
  margin: 15px auto 0; /* espace au-dessus, centré horizontalement */
  max-width: 240px;    /* limite la taille si besoin */
  height: auto; }
.pro-card__illus img{
  display: block;
  margin: 15px auto 0; /* espace au-dessus, centré horizontalement */
  max-width: 240px;    /* limite la taille si besoin */
  height: auto;
}

/* Responsive */
@media (max-width: 980px){
  .pro-intro__grid{ grid-template-columns: 1fr; }
  .pro-intro__visuel{ order:-1; }
  .pro-cards{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px){
  .pro-cards{ grid-template-columns: 1fr; }
  .pro-card__badges img{ height:56px; }
}