:root {
  --primary: #8BC34A;        /* brand green (lime-green) */
  --primary-600: #689F38;    /* darker brand */
  --primary-700: #558B2F;    /* darkest brand */
  --gradient-3: linear-gradient(135deg, var(--primary) 30%, var(--primary-600) 100%);
  
  --text: #3c3c3c;           /* dark gray text */
  --dark: #3c3c3c;
  --muted: #e0e0e0;          /* light gray for borders/subtext */
  --bg: #f6f9fc;             /* subtle gray background */
  --card: #ffffff;           /* white card surface */
  --ring: rgba(139, 195, 74, 0.3); /* soft green glow */
  --bg-light: #f6f9fc;
}




html, body { height: 100%; }
body{
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji';
  color: var(--text);
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(150,193,31,.08), transparent 40%),
    radial-gradient(1000px 500px at 110% 10%, rgba(150,193,31,.06), transparent 35%),
    var(--bg);
  letter-spacing: .01rem;
}

/* NAV */
.navbar{
  --bs-navbar-brand-font-weight: 800;
  backdrop-filter: saturate(1.2) blur(8px);
  background: rgba(255,255,255,.65);
  border-bottom: 1px solid rgba(15, 23, 42, .06);
}
@media (prefers-color-scheme: dark){
  .navbar{ background: rgba(2,6,23,.45); border-color: rgba(255,255,255,.06); }
}
.brand-dot{
  width: .6rem; height: .6rem; background: var(--primary); border-radius: 999px; display: inline-block;
  box-shadow: 0 0 0 .35rem var(--ring);
}

/* HERO */
.hero{ position: relative; overflow: hidden; padding: 8rem 0 5rem; }
.hero h1 span{ color: var(--primary); text-shadow: 0 1px 0 rgba(0,0,0,.05); }
.hero-blob{
  position: absolute; inset: -20% -10% auto auto; width: 60vmax; height: 60vmax; z-index: -1;
  background: radial-gradient(closest-side, rgba(150,193,31,.72), transparent 70%);
  filter: blur(30px);
  animation: float 14s ease-in-out infinite;
}
@keyframes float{ 0%,100%{transform: translateY(0)} 50%{transform: translateY(-18px)} }
.hero-title{ font-weight: 700; }
.text-gray{ color: var(--dark); }
.avatar-pill, .avatar-pill-last{ width:35px; border:2px solid #fff; }
.avatar-pill{ margin-right:-10px; }

/* BUTTONS */
.btn-primary-soft{
  --shadow: 0 10px 25px -8px var(--ring);
  background: linear-gradient(135deg, var(--primary), var(--primary-600));
  border: none; color: #0b1220; font-weight: 700; border-radius: 999px; padding: .9rem 1.35rem;
  box-shadow: var(--shadow);
}
.btn-primary-soft:hover{ transform: translateY(-2px); background: linear-gradient(135deg, var(--primary-700), var(--primary)); }
.btn-outline-neo{ border:2px solid var(--primary); color:var(--primary); border-radius:999px; padding:.9rem 1.35rem; }
.btn-outline-neo:hover{ background:var(--primary); color:#0b1220; }

/* BRAND UTILITIES */
.text-brand{ color: var(--primary) !important; }
.bg-brand{ background: var(--primary) !important; }
.bg-brand-soft{ background: rgba(150,193,31,.12) !important; }
.border-brand{ border-color: var(--primary) !important; }
.alert-brand{ background: rgba(150,193,31,.10); border: 1px solid rgba(150,193,31,.35); color: #1f2a1c; }

/* CARDS */
.card-neo{
 
  border: 1px solid rgba(15, 23, 42, .06);
  border-radius: 18px; box-shadow: 0 20px 50px -30px rgba(15,23,42,.35);
}


@media (prefers-color-scheme: dark){
  .card-neo{ background: linear-gradient(180deg, rgba(15,23,42,.85), rgba(15,23,42,.75)); border-color: rgba(255,255,255,.06); }
}
/* Feature Cards */ .feature-card { background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(10px); border-radius: 24px; padding: 40px; height: 100%; transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); border: 1px solid rgba(255, 255, 255, 0.2); position: relative; overflow: hidden; } .feature-card::before { content: ''; position: absolute; top: -50%; right: -50%; width: 200%; height: 200%; background: radial-gradient(circle, rgba(139, 195, 74, 0.1) 0%, transparent 70%); transition: all 0.5s ease; opacity: 0; } .feature-card:hover::before { opacity: 1; } .feature-card:hover { transform: translateY(-10px) scale(1.02); box-shadow: 0 30px 60px rgba(0, 0, 0, 0.12); } .feature-icon-wrapper { width: 80px; height: 80px; background: var(--gradient-3); border-radius: 20px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; font-size: 35px; color: white; transition: all 0.3s ease; } .feature-card:hover .feature-icon-wrapper { transform: rotate(10deg) scale(1.1); }

/* PROCESS */
.process-card{
  background: #fff; border-radius: 20px; padding: 30px; text-align: center; position: relative;
  transition: all .3s ease; border: 2px solid transparent;
}
.process-card:hover{ border-color: var(--primary); transform: translateY(-5px); box-shadow: 0 20px 40px rgba(150,193,31,.20); }
.process-number{
  position: absolute; top: -20px; left: 50%; transform: translateX(-50%);
  width: 40px; height: 40px; background: var(--gradient-3); color: #fff; border-radius: 50%;
  display:flex; align-items:center; justify-content:center; font-weight: 800; box-shadow: 0 10px 20px rgba(150,193,31,.30);
}
.process-icon{ font-size: 2.25rem; margin: .25rem 0 1rem; background: var(--gradient-3); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

/* STATS */
.stat{ background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); border-radius: 14px; padding: 1.25rem; backdrop-filter: blur(6px); }
.stat .num{ font-size: clamp(2rem, 5vw, 3rem); font-weight: 800; }

/* TESTIMONIAL */
.quote{ position: relative; }
.quote i{ position: absolute; right: .5rem; top: .5rem; font-size: 2rem; color: rgba(150,193,31,.55); }

/* FOOTER */
footer{ background: var(--dark); color: #fff; }

/* UTILS */
.badge-soft{ background: rgba(150,193,31,.18); color: #0b1220; border:1px solid var(--ring); }
.link-muted{ color: var(--muted); text-decoration: none; }
.link-muted:hover{ color: var(--primary); }
.toast-rgpd{ position: fixed; bottom: 1rem; left: 50%; transform: translateX(-50%); z-index: 1080; }

/* Spacing */
.py-6{ padding-top: 4.5rem !important; padding-bottom: 4.5rem !important; }
.py-7{ padding-top: 6rem !important; padding-bottom: 6rem !important; }

/* Container du slider */
.logos-slider {
  position: relative;
  width: 100%;
  overflow: hidden;
}

/* Ligne des logos en mouvement */
.logos-track {
  display: flex;
  animation: scroll-desktop 35s linear infinite;
}

/* Chaque logo */
.logo-item {
  height: 40px;
  margin: 0 40px;
  filter: grayscale(100%);
  opacity: 0.5;
  transition: all 0.3s ease;
}

.logo-item:hover {
  filter: grayscale(0%);
  opacity: 1;
  transform: scale(1.05);
}

/* Animation desktop */
@keyframes scroll-desktop {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* Responsive : mobile/tablette */
@media (max-width: 768px) {
  .logos-track {
    animation: scroll-mobile 40s linear infinite; /* plus lent */
  }

  .logo-item {
    height: 45px;
    margin: 0 20px;
  }

  @keyframes scroll-mobile {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }
}

/* ---- Benefits figure + chips ---- */
.benefit-img{ width:100%; display:block; border-radius:1rem; }
.benefit-figure .chip{
  position: relative; display:flex; gap:.5rem; align-items:center;
  background: rgba(255,255,255,.9); border:1px solid rgba(150,193,31,.25);
  border-radius: 999px; padding:.5rem .75rem; width: fit-content; margin-top: .75rem;
}
.benefit-figure .chip:nth-child(2){ margin-left: .5rem; }
.benefit-figure .chip:nth-child(3){ margin-left: 1.25rem; }
.chip-bad, .chip-good{ font-weight:600; font-size:.95rem; }
.text-brand{ color: var(--primary) !important; }
.bg-brand{ background: var(--primary) !important; }
.bg-brand-soft{ background: rgba(150,193,31,.12) !important; }
.alert-brand{ background: rgba(150,193,31,.10); border:1px solid rgba(150,193,31,.35); color:#1f2a1c; }

/* ---- Logos slider ---- */
.logos-slider{ position: relative; }
.logos-track{ animation: slide-logos 24s linear infinite; gap: 3rem; }
.logo-item{ height: 40px; opacity:.85; transition: opacity .2s; }
.logo-item:hover{ opacity:1; }
@keyframes slide-logos {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ---- FAQ brand ---- */
.accordion-brand .accordion-button:focus{ box-shadow: 0 0 0 .2rem rgba(150,193,31,.25); }
.accordion-brand .accordion-button:not(.collapsed){ color: var(--primary); background: rgba(150,193,31,.08); }

/* Utilities si absent */
.btn-primary-soft{ background: linear-gradient(135deg, var(--primary), #7ab20f); border:none; color:#0b1220; font-weight:700; border-radius:999px; padding:.9rem 1.35rem; }
.btn-primary-soft:hover{ transform:translateY(-2px); }
.btn-outline-neo{ border:2px solid var(--primary); color:var(--primary); border-radius:999px; padding:.9rem 1.35rem; }
.btn-outline-neo:hover{ background:var(--primary); color:#0b1220; }
.py-6{ padding-top: 4.5rem !important; padding-bottom: 4.5rem !important; }
.py-7{ padding-top: 6rem !important; padding-bottom: 6rem !important; }

/* --- Audience pills --- */
.audience-pills .nav-link{
  border-radius:999px; padding:.6rem 1.1rem; font-weight:600;
  border:1px solid rgba(150,193,31,.25); color:#0b1220; background:#fff;
}
.audience-pills .nav-link i{ opacity:.9; }
.audience-pills .nav-link.active{
  color:#0b1220; background:linear-gradient(135deg, var(--primary), var(--primary-600));
  box-shadow:0 10px 25px -10px rgba(150,193,31,.35); border-color:transparent;
}

/* --- Audience cards & rows --- */
.aud-card{
  display:flex; gap:.75rem; align-items:flex-start; padding:1rem .9rem;
  border:1px solid rgba(15,23,42,.08); border-radius:14px; background:#fff;
}
.aud-card i{ font-size:1.3rem; color:var(--primary); margin-top:.15rem; }

/* check rows (puces) */
.check-row{ display:flex; gap:.7rem; align-items:flex-start; margin-bottom:.6rem; }
.check-row i{ margin-top:.15rem; }

/* mini chips */
.chip-mini{
  border:1px solid rgba(150,193,31,.35); background:rgba(150,193,31,.08);
  color:#1f2a1c; border-radius:999px; padding:.35rem .7rem; font-weight:600; font-size:.9rem;
}

/* images */
#audience img.rounded-4{ border-radius:18px !important; }