/* ════════════════════════════════════════════════════
   ChronoPrévention - Landing + Wizard DUERP
   Palette officielle (depuis chronoprevention.netlify.app)
   ════════════════════════════════════════════════════ */

:root {
  --teal:     #3CADC3;
  --teal-dk:  #247688;
  --teal-xdk: #157099;
  --teal-lt:  #7CD1F4;
  --yellow:   #F8CF5F;
  --yellow-dk:#d4a832;
  --grey:     #7F7F7F;
  --grey-lt:  #f4f6f7;
  --white:    #ffffff;
  --dark:     #0e1e26;
  --text:     #1a2e38;
  --text-md:  #3a5260;
  --text-lt:  #6b8694;
  --success:  #2ecc71;
  --warning:  #F44336;
  --radius:   10px;
  --radius-lg:18px;
  --shadow:    0 4px 24px rgba(21,112,153,0.10);
  --shadow-lg: 0 12px 48px rgba(21,112,153,0.16);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family:'Nunito', -apple-system, BlinkMacSystemFont, sans-serif;
  color:var(--text);
  background:var(--white);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img { max-width:100%; display:block; }
a { color:var(--teal-xdk); text-decoration:none; }

h1, h2, h3, h4 {
  font-family:'Nunito', sans-serif;
  font-weight:800;
  color:var(--text);
  line-height:1.15;
}

.container {
  max-width:1180px;
  margin:0 auto;
  padding:0 1.5rem;
}

/* ════════ HEADER ════════ */
.site-header {
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,0.96);
  backdrop-filter: blur(10px);
  border-bottom:1px solid rgba(0,0,0,0.05);
}
.header-inner {
  display:flex; align-items:center; justify-content:space-between;
  padding:1rem 1.5rem; max-width:1180px; margin:0 auto;
}
.site-logo img { height:44px; }
.header-nav { display:flex; gap:2rem; align-items:center; }
.header-nav a { color:var(--text-md); font-weight:600; font-size:.95rem; transition:color .2s; }
.header-nav a:hover { color:var(--teal-xdk); }

/* ════════ BUTTONS ════════ */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.95rem 1.8rem; border-radius:50px; font-weight:700;
  font-size:1rem; text-decoration:none; cursor:pointer; border:none;
  font-family:'Nunito', sans-serif; transition:all .25s ease;
  white-space:nowrap;
}
.btn-primary {
  background:linear-gradient(135deg, var(--teal) 0%, var(--teal-xdk) 100%);
  color:var(--white);
  box-shadow:0 8px 24px rgba(60,173,195,0.35);
}
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 12px 32px rgba(60,173,195,0.45); color:var(--white); }
.btn-yellow {
  background:linear-gradient(135deg, var(--yellow) 0%, var(--yellow-dk) 100%);
  color:var(--dark); font-weight:800;
  box-shadow:0 8px 24px rgba(248,207,95,0.45);
}
.btn-yellow:hover { transform:translateY(-2px); box-shadow:0 12px 32px rgba(248,207,95,0.6); color:var(--dark); }
.btn-outline {
  background:transparent; color:var(--teal-xdk); border:2px solid var(--teal);
}
.btn-outline:hover { background:var(--teal); color:var(--white); }
.btn-lg { padding:1.15rem 2.4rem; font-size:1.1rem; }
.btn-block { display:flex; width:100%; }

/* ════════ HERO ════════ */
.hero {
  position:relative; padding:5rem 0 6rem; overflow:hidden;
  background:linear-gradient(160deg, var(--grey-lt) 0%, #fff 60%);
}
.hero-shapes {
  position:absolute; inset:0; pointer-events:none; overflow:hidden;
}
.hero-sq1 {
  position:absolute; top:-100px; right:-150px;
  width:500px; height:500px; border-radius:50%;
  background:radial-gradient(circle, rgba(60,173,195,0.15) 0%, transparent 70%);
}
.hero-sq2 {
  position:absolute; bottom:-150px; left:-200px;
  width:600px; height:600px; border-radius:50%;
  background:radial-gradient(circle, rgba(248,207,95,0.12) 0%, transparent 70%);
}
.hero-inner {
  position:relative; z-index:2;
  display:grid; grid-template-columns:1.1fr 1fr; gap:4rem; align-items:center;
}
.hero-badge {
  display:inline-flex; align-items:center; gap:.5rem;
  background:rgba(60,173,195,0.1); color:var(--teal-xdk);
  padding:.5rem 1rem; border-radius:50px; font-weight:700;
  font-size:.85rem; margin-bottom:1.4rem;
}
.hero h1 {
  font-size:clamp(2.2rem, 4.5vw, 3.8rem);
  margin-bottom:1.4rem; color:var(--text);
}
.hero h1 em {
  font-style:normal; color:var(--teal-xdk);
  background:linear-gradient(180deg, transparent 65%, var(--yellow) 65%);
  padding:0 .2em;
}
.hero-subtitle {
  font-size:1.18rem; color:var(--text-md); margin-bottom:2rem;
  max-width:540px;
}
.hero-cta-row { display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:1.8rem; }
.hero-trust {
  display:flex; gap:1.5rem; flex-wrap:wrap;
  font-size:.9rem; color:var(--text-lt);
}
.hero-trust span { display:inline-flex; align-items:center; gap:.4rem; }
.hero-trust span::before { content:"✓"; color:var(--success); font-weight:900; }

.hero-visual {
  position:relative;
  padding:30px 50px 30px 50px; /* marge pour accueillir les logos qui débordent */
}
.hero-visual .hero-portrait {
  width:100%; border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);
  display:block;
}

/* ── Badge IPRP officiel (rond) en superposition sur la photo */
.hero-iprp-badge {
  position:absolute; top:8px; right:8px;
  width:88px; height:88px;
  border-radius:50%;
  background:white;
  padding:3px;
  box-shadow:0 10px 26px -6px rgba(0,0,0,0.3);
  z-index:5;
  animation:float-bob 3s ease-in-out infinite;
}

/* ── Logos d'organismes officiels autour de la photo */
.hero-logo {
  position:absolute; z-index:4;
  width:66px; height:66px;
  background:white;
  border-radius:50%;
  box-shadow:0 6px 18px -4px rgba(0,0,0,0.22);
  display:flex; align-items:center; justify-content:center;
  padding:7px;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s;
}
.hero-logo img {
  max-width:100%; max-height:100%;
  object-fit:contain;
}
.hero-logo:hover {
  transform:scale(1.15);
  box-shadow:0 12px 28px -4px rgba(0,0,0,0.3);
  z-index:6;
}
/* Positions autour de la photo */
.hero-logo-qualiopi   { top:-5px;  left:15px; }
.hero-logo-mintravail { top:30%;   left:-30px; }
.hero-logo-inrs       { bottom:30%; left:-30px; }
.hero-logo-carsat     { top:30%;   right:-30px; }
.hero-logo-cnam       { bottom:30%; right:-30px; }
.hero-floating-card {
  position:absolute; bottom:-25px; left:-30px;
  background:white; padding:1.2rem 1.5rem;
  border-radius:var(--radius); box-shadow:var(--shadow-lg);
  display:flex; align-items:center; gap:1rem;
  max-width:280px;
}
.hero-floating-card-icon {
  width:48px; height:48px; border-radius:50%;
  background:linear-gradient(135deg, var(--teal), var(--teal-xdk));
  display:flex; align-items:center; justify-content:center;
  color:white; font-size:1.4rem; flex-shrink:0;
}
.hero-floating-card-title {
  font-weight:800; color:var(--text); font-size:.95rem;
}
.hero-floating-card-desc { font-size:.8rem; color:var(--text-lt); }

/* ════════ SECTIONS GÉNÉRIQUES ════════ */
.section { padding:5rem 0; }
.section-grey { background:var(--grey-lt); }
.section-dark { background:linear-gradient(135deg, var(--dark) 0%, var(--teal-xdk) 100%); color:white; }
.section-dark h2, .section-dark h3 { color:white; }
.section-title {
  text-align:center; max-width:780px; margin:0 auto 3rem;
}
.section-title h2 {
  font-size:clamp(1.8rem, 3.5vw, 2.6rem);
  margin-bottom:1rem;
}
.section-title p {
  font-size:1.1rem; color:var(--text-md);
}
.section-title em { font-style:normal; color:var(--teal-xdk); }

/* ════════ PROBLEM SECTION ════════ */
.problem-grid {
  display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:2rem; margin-top:3rem;
}
.problem-card {
  background:white; padding:2rem; border-radius:var(--radius-lg);
  box-shadow:var(--shadow); text-align:center;
  transition:transform .2s, box-shadow .2s;
}
.problem-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.problem-card-icon { font-size:2.5rem; margin-bottom:1rem; }
.problem-card h3 { font-size:1.15rem; margin-bottom:.6rem; color:var(--teal-xdk); }
.problem-card p { color:var(--text-md); font-size:.95rem; }

/* ════════ LOI 2021 ════════ */
.loi-grid {
  display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:1.5rem; margin-top:3rem;
}
.loi-card {
  background:white; padding:1.8rem; border-radius:var(--radius);
  border-left:4px solid var(--teal); box-shadow:var(--shadow);
}
.loi-card h3 { color:var(--teal-xdk); margin-bottom:.6rem; font-size:1.05rem; }
.loi-card p { color:var(--text-md); font-size:.92rem; }

/* ════════ PROCESS (4 STEPS) ════════ */
.process-steps {
  display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:1.5rem; margin-top:3rem;
}
.process-step {
  background:white; padding:2rem 1.5rem; border-radius:var(--radius-lg);
  text-align:center; box-shadow:var(--shadow); position:relative;
}
.process-step-num {
  position:absolute; top:-22px; left:50%; transform:translateX(-50%);
  width:44px; height:44px; border-radius:50%;
  background:linear-gradient(135deg, var(--teal), var(--teal-xdk));
  color:white; font-weight:900; font-size:1.2rem;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 16px rgba(21,112,153,0.4);
}
.process-step h3 { margin:1rem 0 .6rem; color:var(--teal-xdk); font-size:1.1rem; }
.process-step p { color:var(--text-md); font-size:.92rem; }

/* ════════ COMPARE TABLE ════════ */
.compare-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:2rem; margin-top:3rem;
}
.compare-card { padding:2.5rem; border-radius:var(--radius-lg); }
.compare-bad { background:#fff5f5; border:2px solid #ffd6d6; }
.compare-good { background:linear-gradient(135deg, rgba(60,173,195,0.08), rgba(248,207,95,0.08));
                border:2px solid var(--teal); }
.compare-card h3 { font-size:1.4rem; margin-bottom:1.4rem; }
.compare-bad h3 { color:#c0392b; }
.compare-good h3 { color:var(--teal-xdk); }
.compare-list { list-style:none; }
.compare-list li { padding:.6rem 0; display:flex; gap:.7rem; align-items:flex-start; }
.compare-bad .compare-list li::before { content:"✕"; color:#c0392b; font-weight:900; flex-shrink:0; }
.compare-good .compare-list li::before { content:"✓"; color:var(--success); font-weight:900; flex-shrink:0; }

/* ════════ OFFRES (PRICING) ════════ */
.offres-grid {
  display:grid; grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:2rem; margin:3rem auto 0; max-width:780px;
}
.offres-grid-3 {
  grid-template-columns:repeat(3, minmax(0, 1fr));
  max-width:1100px; gap:1.8rem;
}
@media (max-width: 980px) {
  .offres-grid-3 { grid-template-columns:1fr; max-width:520px; }
  .offres-grid-3 .offre-card.featured { transform:none; }
}
@media (max-width: 720px) {
  .offres-grid { grid-template-columns:1fr; }
}
.offre-tag {
  position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  padding:.3rem 1rem; border-radius:50px;
  font-size:.7rem; font-weight:800; text-transform:uppercase;
  letter-spacing:.6px; white-space:nowrap;
}
.offre-tag-diy {
  background:var(--grey-lt); color:var(--text-md);
  font-size:.65rem; letter-spacing:.5px;
}
.offre-tag-best {
  background:var(--yellow); color:var(--dark);
  font-size:.65rem; letter-spacing:.4px;
  box-shadow:0 6px 16px -4px rgba(248, 207, 95, .6);
}
.offre-warning {
  background:rgba(243, 156, 18, .08);
  border-left:3px solid rgba(243, 156, 18, .7);
  padding:.7rem .85rem; border-radius:6px;
  font-size:.78rem; line-height:1.5; color:var(--text-md);
  margin:0 0 1.2rem;
}
.offre-warning strong { color:#b8780f; }
.offres-disclaimer {
  max-width:900px; margin:2.2rem auto 0;
  text-align:center; font-size:.85rem;
  color:var(--text-lt); line-height:1.6;
  padding:0 1rem;
}
.offres-disclaimer strong { color:var(--text-md); }

/* Encadré orange "info" : inspection du travail / contrôle → IPRP gratuit */
.iprp-alert {
  max-width:780px;
  margin:2.2rem auto 0;
  background:#fff8ec;
  border:1px solid #f4d088;
  border-left:5px solid #e8a317;
  border-radius:10px;
  padding:1.4rem 1.6rem;
  color:var(--text);
  display:flex; gap:1.1rem; align-items:flex-start;
}
.iprp-alert-emoji {
  font-size:1.6rem; line-height:1.2; flex-shrink:0;
}
.iprp-alert-body { flex:1; min-width:0; }
.iprp-alert-body h3 {
  font-size:1.05rem; font-weight:800;
  color:#8a5a10; margin:0 0 .55rem;
  line-height:1.35;
}
.iprp-alert-body p {
  margin:0 0 1rem;
  font-size:.95rem; line-height:1.6;
  color:var(--text-md);
}
.iprp-alert-body p strong { color:#8a5a10; font-weight:700; }
.iprp-alert-cta {
  display:inline-flex; align-items:center; gap:.5rem;
  background:#e8a317;
  color:#fff !important;
  font-weight:700; font-size:.95rem;
  padding:.7rem 1.3rem; border-radius:8px;
  text-decoration:none;
  transition:background .15s, transform .15s;
}
.iprp-alert-cta:hover {
  background:#c98d0a;
  transform:translateY(-1px);
  text-decoration:none;
}
.iprp-alert-contact {
  margin-top:.7rem;
  font-size:.82rem;
  color:var(--text-lt);
  display:flex; flex-wrap:wrap; gap:.3rem 1rem;
}
.iprp-alert-contact a {
  color:var(--teal-xdk); font-weight:600; text-decoration:none;
}
.iprp-alert-contact a:hover { text-decoration:underline; }
@media (max-width:600px) {
  .iprp-alert { padding:1.2rem; flex-direction:column; gap:.5rem; }
  .iprp-alert-emoji { font-size:1.4rem; }
}

/* Grille tarifaire dans la card Offre Confort — compacte */
.offre-tarif-grid {
  background:rgba(60, 173, 195, .08);
  border:1px solid rgba(60, 173, 195, .18);
  border-radius:8px;
  padding:.55rem .7rem;
  margin:0 0 1rem;
  display:grid; gap:0;
  font-size:.74rem;
}
.offre-tarif-grid > div {
  display:flex; justify-content:space-between; align-items:baseline;
  padding:.22rem 0;
  border-bottom:1px solid rgba(60, 173, 195, .12);
}
.offre-tarif-grid > div:last-child { border-bottom:none; }
.offre-tarif-grid strong { color:var(--text-md); font-weight:600; font-size:.74rem; }
.offre-tarif-grid span { color:var(--teal-xdk); font-weight:800; font-size:.78rem; }
.offre-card {
  background:white; padding:2.2rem 1.7rem 1.8rem;
  border-radius:var(--radius-lg);
  box-shadow:0 6px 20px -8px rgba(21, 112, 153, 0.18);
  position:relative;
  border:2px solid transparent;
  transition:transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s, border-color .2s;
  display:flex; flex-direction:column;  /* contenu vertical, bouton en bas */
  min-height:100%;
}
.offre-card:hover {
  transform:translateY(-5px);
  box-shadow:0 18px 40px -12px rgba(21, 112, 153, 0.25);
  border-color:rgba(60, 173, 195, 0.25);
}
.offre-card.featured {
  border-color:var(--teal);
  box-shadow:0 16px 40px -12px rgba(60, 173, 195, 0.35);
  background:linear-gradient(180deg, #ffffff 0%, #f9fcfd 100%);
}
.offre-card.featured:hover { transform:translateY(-6px); }
.offre-card.featured::before {
  content:"Le plus choisi"; position:absolute; top:-14px; left:50%;
  transform:translateX(-50%); background:var(--yellow);
  color:var(--dark); padding:.3rem 1rem; border-radius:50px;
  font-size:.72rem; font-weight:800; text-transform:uppercase;
  letter-spacing:1px;
  box-shadow:0 6px 14px -4px rgba(248,207,95,0.5);
}
.offre-card h3 {
  color:var(--teal-xdk); margin-bottom:.4rem;
  font-size:1.35rem; font-weight:800;
}
.offre-card-tagline {
  color:var(--text-lt); font-size:.88rem;
  margin-bottom:1.3rem; min-height:2.6em;  /* harmonise sur 2 lignes */
}
.offre-price {
  font-size:2.4rem; font-weight:900; color:var(--text);
  margin-bottom:.15rem; line-height:1;
}
.offre-price-suffix { font-size:.95rem; color:var(--text-lt); font-weight:600; }
.offre-period {
  font-size:.8rem; color:var(--text-lt);
  margin-bottom:1.4rem;
  min-height:1.4em;
}
.offre-features {
  list-style:none;
  margin:0 0 1.2rem;
  flex:1;  /* occupe l'espace disponible, pousse le bouton en bas */
}
.offre-features li {
  padding:.42rem 0; display:flex; gap:.55rem; align-items:flex-start;
  font-size:.9rem; color:var(--text-md); line-height:1.45;
}
.offre-features li::before {
  content:"✓"; color:var(--teal); font-weight:900; flex-shrink:0;
  font-size:.95rem; line-height:1.45;
}
/* Bouton de la card : toujours en bas, plein largeur */
.offre-card > .btn,
.offre-card > a.btn {
  margin-top:auto;
}
/* Warning compact pour ne pas grossir les cards DIY */
.offre-warning {
  background:rgba(243, 156, 18, 0.07);
  border-left:3px solid rgba(243, 156, 18, 0.55);
  padding:.6rem .75rem; border-radius:6px;
  font-size:.72rem; line-height:1.5; color:var(--text-md);
  margin:0 0 1rem;
}
.offre-warning strong { color:#b8780f; font-weight:700; }

/* ════════ SECTION IPRP (Jessica + badges + contact) ════════ */
.iprp-block {
  display:grid; grid-template-columns:minmax(280px, 360px) 1fr;
  gap:3rem; align-items:center;
  max-width:1000px; margin:3rem auto 0;
}
.iprp-photo-wrap {
  position:relative;
  width:280px; height:280px;
  margin:0 auto;
}
.iprp-photo {
  width:100%; height:100%; object-fit:cover;
  border-radius:50%;
  box-shadow:0 18px 50px -16px rgba(21, 112, 153, 0.45);
  border:6px solid white;
  position:relative; z-index:2;
}
.iprp-badge-iprp {
  position:absolute; bottom:-10px; right:-10px; z-index:5;
  width:90px; height:90px;
  border-radius:50%;
  background:white;
  padding:4px;
  box-shadow:0 10px 24px -6px rgba(0, 0, 0, 0.25);
  animation:float-bob 3s ease-in-out infinite;
}
@keyframes float-bob {
  0%, 100% { transform:translateY(0); }
  50% { transform:translateY(-5px); }
}

/* Logos officiels disposés en cercle autour de la photo */
.iprp-logo {
  position:absolute; z-index:3;
  width:74px; height:74px;
  background:white;
  border-radius:50%;
  box-shadow:0 6px 18px -4px rgba(0, 0, 0, 0.2);
  display:flex; align-items:center; justify-content:center;
  padding:8px;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s;
  cursor:default;
}
.iprp-logo img {
  max-width:100%; max-height:100%;
  object-fit:contain;
}
.iprp-logo:hover {
  transform:scale(1.15);
  box-shadow:0 12px 28px -4px rgba(0, 0, 0, 0.28);
  z-index:4;
}
/* Positions autour de la photo (cercle de 280px) */
.iprp-logo-qualiopi   { top:5%;  left:-40px; }
.iprp-logo-mintravail { top:-25px; left:50%; transform:translateX(-50%); }
.iprp-logo-inrs       { top:5%;  right:-40px; }
.iprp-logo-carsat     { bottom:30%; left:-55px; }
.iprp-logo-cnam       { bottom:30%; right:-55px; }
.iprp-logo-mintravail:hover { transform:translateX(-50%) scale(1.15); }

.iprp-info {
  padding:0 1rem;
}
.iprp-info h3 {
  font-size:1.8rem; margin-bottom:.4rem; color:var(--teal-xdk);
}
.iprp-role {
  color:var(--text-md); font-size:.95rem; line-height:1.6;
  margin-bottom:1.5rem;
}
.iprp-contact-bubble {
  display:flex; flex-direction:column; gap:.7rem;
  background:linear-gradient(135deg, rgba(60, 173, 195, .08) 0%, rgba(60, 173, 195, .02) 100%);
  border-left:4px solid var(--teal);
  border-radius:10px;
  padding:1rem 1.2rem;
  margin-bottom:1.4rem;
}
.iprp-contact-link {
  display:flex; gap:.9rem; align-items:center;
  text-decoration:none;
  transition:transform .2s;
}
.iprp-contact-link:hover { transform:translateX(3px); }
.iprp-contact-icon {
  width:38px; height:38px;
  background:white;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem;
  box-shadow:0 4px 10px -2px rgba(60, 173, 195, .25);
  flex-shrink:0;
}
.iprp-contact-label {
  font-size:.72rem; font-weight:700; color:var(--text-lt);
  text-transform:uppercase; letter-spacing:.5px;
}
.iprp-contact-value {
  font-size:1rem; font-weight:800; color:var(--teal-xdk);
}
.iprp-credo {
  font-style:italic; color:var(--text-md);
  font-size:.93rem; line-height:1.65;
  padding-left:1rem;
  border-left:3px solid var(--yellow);
}

@media (max-width: 880px) {
  .iprp-block { grid-template-columns:1fr; gap:2rem; }
  .iprp-photo-wrap { width:240px; height:240px; }
  .iprp-info { text-align:center; padding:0; }
  .iprp-credo { text-align:left; }
  .iprp-contact-bubble { text-align:left; }
}

/* ════════ TÉMOIGNAGES ════════ */
.reviews-rating {
  display:inline-flex; align-items:center; gap:.4rem;
}
.reviews-stars {
  color:#FBBC04;
  font-size:1.1rem;
  letter-spacing:1px;
}
.testimonials-grid {
  display:grid; grid-template-columns:repeat(3, 1fr); gap:1.6rem;
  margin-top:3rem;
}

/* ── Marquee défilante (carousel auto-scroll) */
.reviews-marquee {
  position:relative;
  margin-top:2.5rem;
  overflow:hidden;
  padding:1rem 0;
  /* Masque dégradé sur les bords pour effet "fondu" */
  -webkit-mask-image:linear-gradient(to right, transparent 0, black 80px, black calc(100% - 80px), transparent 100%);
          mask-image:linear-gradient(to right, transparent 0, black 80px, black calc(100% - 80px), transparent 100%);
}
.reviews-track {
  display:flex;
  gap:1.5rem;
  width:max-content;
  animation:scroll-reviews 180s linear infinite;
}
.reviews-marquee:hover .reviews-track {
  animation-play-state:paused;
}
@keyframes scroll-reviews {
  0%   { transform:translateX(0); }
  100% { transform:translateX(-50%); }
}
.review-card {
  flex:0 0 340px;
  background:white;
  border-radius:var(--radius-lg);
  padding:1.5rem 1.4rem;
  box-shadow:0 4px 16px -4px rgba(0,0,0,0.08);
  display:flex; flex-direction:column;
  min-height:200px;
}
.testimonial {
  background:white;
  border-radius:var(--radius-lg);
  padding:1.8rem 1.5rem;
  box-shadow:var(--shadow);
  position:relative;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s;
  display:flex; flex-direction:column;
}
.testimonial:hover {
  transform:translateY(-4px);
  box-shadow:0 16px 36px -10px rgba(21, 112, 153, 0.18);
}
.testimonial-stars {
  color:#FBBC04;
  letter-spacing:2px;
  font-size:1.05rem;
  margin-bottom:.8rem;
}
.testimonial-text {
  flex:1;
  color:var(--text-md);
  font-size:.95rem;
  line-height:1.6;
  margin-bottom:1.4rem;
}
.testimonial-author {
  display:flex; gap:.8rem; align-items:center;
  padding-top:1rem;
  border-top:1px solid var(--grey-lt);
}
.testimonial-avatar {
  width:42px; height:42px;
  background:linear-gradient(135deg, var(--teal) 0%, var(--teal-xdk) 100%);
  color:white;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:.95rem;
  flex-shrink:0;
}
.testimonial-author-info { flex:1; }
.testimonial-author-name {
  font-weight:800; font-size:.95rem; color:var(--text);
}
.testimonial-author-source {
  font-size:.78rem; color:var(--text-lt); margin-top:1px;
}
.testimonial-google {
  width:30px; height:30px;
  background:white;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-family:'Arial', sans-serif;
  font-weight:900; font-size:1rem;
  color:#4285F4;
  border:1.5px solid var(--grey-lt);
  flex-shrink:0;
}

@media (max-width: 880px) {
  .testimonials-grid { grid-template-columns:1fr; }
}

/* ════════ CTA FINAL ════════ */
.cta-final {
  background:linear-gradient(135deg, var(--teal-xdk) 0%, var(--dark) 100%);
  color:white; text-align:center;
  padding:5rem 0; border-radius:var(--radius-lg);
  margin:0 1.5rem;
}
.cta-final h2 { color:white; font-size:clamp(1.8rem, 3.5vw, 2.5rem); margin-bottom:1rem; }
.cta-final p { font-size:1.1rem; max-width:600px; margin:0 auto 2rem; opacity:.92; }

/* ════════ FOOTER ════════ */
.site-footer {
  background:var(--dark); color:white; padding:3rem 0 1.5rem;
}
.footer-grid {
  display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:3rem;
  margin-bottom:2.5rem;
}
.footer-brand img { height:40px; filter:brightness(0) invert(1); margin-bottom:1rem; }
.footer-brand p { color:rgba(255,255,255,0.7); font-size:.92rem; line-height:1.6; }
.footer-col h4 { color:var(--yellow); margin-bottom:1rem; font-size:1rem; }
.footer-col a { display:block; color:rgba(255,255,255,0.75); padding:.3rem 0; font-size:.92rem; }
.footer-col a:hover { color:var(--yellow); }
.footer-bottom {
  border-top:1px solid rgba(255,255,255,0.1);
  padding-top:1.5rem; text-align:center;
  color:rgba(255,255,255,0.5); font-size:.85rem;
}

/* ════════ FLOATING CTA STICKY ════════ */
.floating-cta {
  position:fixed; bottom:25px; right:25px; z-index:90;
  box-shadow:0 12px 40px rgba(60,173,195,0.5);
  animation:pulse 2.5s ease-in-out infinite;
}
@keyframes pulse {
  0%, 100% { transform:scale(1); }
  50% { transform:scale(1.04); }
}

/* ════════ WIZARD ════════ */
.wizard-page {
  background:linear-gradient(160deg, var(--grey-lt) 0%, #fff 60%);
  min-height:100vh; padding:2rem 1rem;
}
.wizard-container {
  max-width:680px; margin:2rem auto; background:white;
  border-radius:var(--radius-lg); box-shadow:var(--shadow-lg);
  padding:2.5rem; position:relative;
}
.wizard-back {
  position:absolute; top:1.5rem; left:1.5rem;
  color:var(--text-lt); font-size:.9rem; font-weight:600;
}
.wizard-back:hover { color:var(--teal-xdk); }
.wizard-progress {
  display:flex; gap:.5rem; margin-bottom:2.5rem;
}
.wizard-progress-step {
  flex:1; height:6px; border-radius:3px; background:var(--grey-lt);
  transition:background .3s;
}
.wizard-progress-step.active { background:var(--teal); }
.wizard-step h2 {
  font-size:1.6rem; margin-bottom:.5rem; color:var(--text);
}
.wizard-step .step-subtitle {
  color:var(--text-md); margin-bottom:2rem; font-size:1rem;
}
.form-group { margin-bottom:1.4rem; }
.form-group label {
  display:block; font-size:.85rem; font-weight:700;
  color:var(--text-md); margin-bottom:.5rem;
  text-transform:uppercase; letter-spacing:.5px;
}
.form-group input, .form-group select, .form-group textarea {
  width:100%; padding:.95rem 1rem; border:2px solid var(--grey-lt);
  border-radius:var(--radius); font-size:1rem; font-family:inherit;
  color:var(--text); background:#fafbfc;
  transition:all .2s;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  outline:none; border-color:var(--teal); background:white;
  box-shadow:0 0 0 4px rgba(60,173,195,0.15);
}
.form-group textarea { resize:vertical; min-height:90px; }
.form-hint { font-size:.82rem; color:var(--text-lt); margin-top:.4rem; }

.search-results {
  margin-top:.5rem; border:1px solid var(--grey-lt);
  border-radius:var(--radius); max-height:280px; overflow:auto;
  background:white;
}
.search-result-item {
  padding:1rem; border-bottom:1px solid var(--grey-lt); cursor:pointer;
  transition:background .15s;
}
.search-result-item:hover { background:var(--grey-lt); }
.search-result-item:last-child { border-bottom:none; }
.search-result-name { font-weight:700; color:var(--text); }
.search-result-meta { font-size:.85rem; color:var(--text-lt); margin-top:.2rem; }

.selected-company {
  background:linear-gradient(135deg, rgba(60,173,195,0.08), rgba(248,207,95,0.05));
  border:2px solid var(--teal); border-radius:var(--radius);
  padding:1.2rem; margin-bottom:1.4rem;
}
.selected-company-name { font-weight:800; color:var(--teal-xdk); }
.selected-company-meta { font-size:.88rem; color:var(--text-md); margin-top:.3rem; }
.selected-company-change {
  display:inline-block; margin-top:.6rem; font-size:.85rem;
  color:var(--teal-xdk); cursor:pointer; font-weight:700;
}

.chip-row { display:flex; flex-wrap:wrap; gap:.5rem; }
.chip {
  padding:.5rem 1rem; border:2px solid var(--grey-lt);
  border-radius:50px; background:white; cursor:pointer;
  font-size:.9rem; font-weight:600; color:var(--text-md);
  transition:all .15s;
}
.chip:hover { border-color:var(--teal-lt); color:var(--teal-xdk); }
.chip.active { border-color:var(--teal); background:var(--teal); color:white; }

.wizard-nav {
  display:flex; justify-content:space-between; gap:1rem;
  margin-top:2.5rem; padding-top:1.5rem;
  border-top:1px solid var(--grey-lt);
}
.wizard-nav .btn-outline { padding:.85rem 1.5rem; }

/* ════════ LOADING ════════ */
.loader {
  text-align:center; padding:3rem 1rem;
  max-width:520px; margin:0 auto;
}
.spinner {
  width:60px; height:60px; border:6px solid var(--grey-lt);
  border-top-color:var(--teal); border-radius:50%;
  animation:spin 1s linear infinite; margin:0 auto 1.5rem;
}
@keyframes spin { to { transform:rotate(360deg); } }

/* ── Orbe pulsée (remplace le spinner) */
.loader-orb {
  position:relative; width:96px; height:96px; margin:0 auto 1.8rem;
}
.loader-orb-core {
  position:absolute; inset:24px;
  background:linear-gradient(135deg, var(--teal) 0%, var(--teal-xdk) 100%);
  border-radius:50%;
  box-shadow:0 0 32px rgba(60, 173, 195, 0.55), inset 0 0 12px rgba(255,255,255,0.15);
  animation:orb-bob 2.2s ease-in-out infinite;
}
.loader-orb-pulse {
  position:absolute; inset:0;
  border:2px solid var(--teal);
  border-radius:50%;
  animation:orb-pulse 2.2s ease-out infinite;
}
.loader-orb-pulse::before {
  content:""; position:absolute; inset:-4px;
  border:2px solid var(--teal);
  border-radius:50%;
  opacity:0;
  animation:orb-pulse 2.2s ease-out infinite .55s;
}
@keyframes orb-bob {
  0%, 100% { transform:scale(1); }
  50% { transform:scale(1.06); }
}
@keyframes orb-pulse {
  0% { transform:scale(0.8); opacity:.7; }
  100% { transform:scale(1.6); opacity:0; }
}

.loader-text { font-weight:800; color:var(--text); font-size:1.2rem; margin-bottom:.5rem; }
.loader-subtext { color:var(--text-lt); font-size:.95rem; line-height:1.55; max-width:380px; margin:0 auto; }

/* ── Barre de progression */
.loader-progress-wrap {
  display:flex; align-items:center; gap:1rem;
  margin:1.8rem auto 1rem; max-width:420px;
}
.loader-progress {
  flex:1; height:8px;
  background:var(--grey-lt);
  border-radius:100px;
  overflow:hidden;
  position:relative;
}
.loader-progress-fill {
  height:100%; width:0%;
  background:linear-gradient(90deg, var(--teal) 0%, var(--teal-xdk) 100%);
  border-radius:100px;
  transition:width .9s cubic-bezier(.4,0,.2,1);
  box-shadow:0 0 12px rgba(60, 173, 195, 0.55);
  position:relative;
}
.loader-progress-fill::after {
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.4) 50%, transparent 100%);
  animation:shimmer 1.5s linear infinite;
}
@keyframes shimmer {
  0% { transform:translateX(-100%); }
  100% { transform:translateX(100%); }
}
.loader-percent {
  font-weight:800; color:var(--teal-xdk); font-size:.95rem;
  min-width:40px; text-align:right;
  font-variant-numeric:tabular-nums;
}
.loader-status { color:var(--text-md); font-weight:600; font-size:.9rem; margin-top:.4rem; min-height:1.2em; }

/* ════════ SCROLL REVEAL (apparition au scroll) ════════ */
.reveal {
  opacity:0; transform:translateY(20px);
  transition:opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1);
}
.reveal.is-visible { opacity:1; transform:translateY(0); }
.reveal-delay-1 { transition-delay:.08s; }
.reveal-delay-2 { transition-delay:.16s; }
.reveal-delay-3 { transition-delay:.24s; }

/* ════════ WIZARD STEP TRANSITIONS ════════ */
.wizard-step {
  animation:step-in .45s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes step-in {
  from { opacity:0; transform:translateY(12px); }
  to   { opacity:1; transform:translateY(0); }
}

/* ════════ PREVIEW DUERP ════════ */
.preview-section {
  background:white; border:2px solid var(--teal-lt);
  border-radius:var(--radius); padding:1.5rem; margin:1.5rem 0;
  position:relative; overflow:hidden;
}
.preview-section::after {
  content:""; position:absolute; bottom:0; left:0; right:0; height:120px;
  background:linear-gradient(180deg, transparent, white);
  pointer-events:none;
}
.preview-table {
  width:100%; border-collapse:collapse; font-size:.85rem;
}
.preview-table th {
  background:var(--teal-xdk); color:white; padding:.7rem;
  text-align:left; font-weight:700;
}
.preview-table td {
  padding:.7rem; border-bottom:1px solid var(--grey-lt);
  vertical-align:top; color:var(--text-md);
}
.preview-table tr:nth-child(even) td { background:var(--grey-lt); }
.risk-badge {
  display:inline-block; padding:.2rem .6rem; border-radius:4px;
  font-weight:700; font-size:.78rem; color:white;
}
.risk-high { background:var(--warning); }
.risk-med { background:#f0922b; }
.risk-low { background:var(--success); }

.preview-summary {
  display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));
  gap:1rem; margin-bottom:1.5rem;
}
.preview-stat {
  background:var(--grey-lt); padding:1rem; border-radius:var(--radius);
  text-align:center;
}
.preview-stat-value {
  font-size:1.8rem; font-weight:900; color:var(--teal-xdk); line-height:1;
}
.preview-stat-label {
  font-size:.78rem; color:var(--text-lt); text-transform:uppercase;
  letter-spacing:.5px; margin-top:.3rem; font-weight:700;
}

/* ════════ PRICING SELECT (post-wizard) ════════ */
.pricing-wrap {
  display:grid; grid-template-columns:1fr 1fr; gap:1.5rem;
  margin-top:1.5rem;
  align-items:stretch;
}
.pricing-card {
  background:white; padding:1.9rem 1.5rem 1.6rem;
  border-radius:var(--radius-lg);
  border:2px solid var(--grey-lt); cursor:pointer;
  transition:transform .25s, box-shadow .25s, border-color .2s;
  position:relative;
  display:flex; flex-direction:column;  /* contenu vertical, bouton en bas */
  box-shadow:0 4px 14px -6px rgba(21, 112, 153, 0.15);
}
.pricing-card:hover {
  border-color:var(--teal-lt);
  transform:translateY(-4px);
  box-shadow:0 14px 32px -10px rgba(21, 112, 153, 0.25);
}
.pricing-card.popular {
  border-color:var(--teal);
  background:linear-gradient(180deg, #ffffff 0%, #f9fcfd 100%);
  box-shadow:0 12px 30px -10px rgba(60, 173, 195, 0.35);
}
.pricing-card.popular::before {
  content:"Recommandé"; position:absolute; top:-12px; right:1rem;
  background:var(--yellow); color:var(--dark);
  padding:.25rem .85rem; border-radius:50px; font-size:.7rem;
  font-weight:800; text-transform:uppercase; letter-spacing:.7px;
  box-shadow:0 4px 12px -3px rgba(248, 207, 95, 0.6);
}
.pricing-card h3 {
  color:var(--teal-xdk); font-size:1.25rem; font-weight:800;
  margin-bottom:.25rem;
}
.pricing-card .tagline {
  color:var(--text-lt); font-size:.85rem;
  margin-bottom:.9rem; min-height:2.4em;
}
.pricing-card .price {
  font-size:2rem; font-weight:900; color:var(--text); line-height:1;
}
.pricing-card .price-suffix { font-size:.9rem; color:var(--text-lt); font-weight:600; }
.pricing-card ul {
  list-style:none; margin:1.1rem 0 1rem;
  flex:1;  /* push button to bottom */
}
.pricing-card ul li {
  padding:.36rem 0; font-size:.87rem; color:var(--text-md);
  display:flex; gap:.5rem; line-height:1.45;
}
.pricing-card ul li::before {
  content:"✓"; color:var(--teal); font-weight:900;
  flex-shrink:0;
}
.pricing-card > .btn,
.pricing-card > button.btn {
  margin-top:auto;
}

/* Variante 3 colonnes pour le wizard */
.pricing-wrap-3 { grid-template-columns:repeat(3, minmax(0, 1fr)); }
@media (max-width: 980px) {
  .pricing-wrap-3 { grid-template-columns:1fr; }
}

/* Tag DIY / Plébiscité */
.pricing-tag {
  position:absolute; top:-12px; left:50%; transform:translateX(-50%);
  background:var(--grey-lt); color:var(--text-md);
  padding:.25rem .8rem; border-radius:50px;
  font-size:.65rem; font-weight:800; text-transform:uppercase;
  letter-spacing:.5px; white-space:nowrap;
}
.pricing-tag-best {
  background:var(--yellow); color:var(--dark);
  box-shadow:0 6px 16px -4px rgba(248, 207, 95, .6);
}

/* Encadré jaune d'avertissement DIY */
.pricing-warning {
  background:rgba(243, 156, 18, .08);
  border-left:3px solid rgba(243, 156, 18, .7);
  padding:.55rem .7rem; border-radius:5px;
  font-size:.74rem; line-height:1.5; color:var(--text-md);
  margin:.4rem 0 1rem;
}

/* Champ mis en avant dans le wizard (ex: contraintes environnementales) */
.form-group-highlight {
  position:relative;
  background:linear-gradient(135deg, rgba(60, 173, 195, .07) 0%, rgba(248, 207, 95, .04) 100%);
  border:2px dashed rgba(60, 173, 195, .35);
  border-radius:12px;
  padding:1.6rem 1.3rem 1.3rem;
  margin:1.5rem 0;
}
.form-highlight-badge {
  position:absolute; top:-12px; left:1.2rem;
  background:var(--yellow); color:var(--dark);
  padding:.25rem .75rem; border-radius:50px;
  font-size:.7rem; font-weight:800; letter-spacing:.4px;
  text-transform:uppercase;
  box-shadow:0 4px 12px -2px rgba(248, 207, 95, .5);
}
.form-group-highlight label {
  font-size:1.02rem; font-weight:800; color:var(--teal-xdk);
  display:flex; flex-wrap:wrap; gap:.4rem; align-items:baseline;
  margin-bottom:.4rem;
}
.form-label-optional {
  font-size:.78rem; font-weight:600; color:var(--text-lt);
}
.form-highlight-desc {
  color:var(--text-md); font-size:.9rem;
  line-height:1.55; margin-bottom:.8rem;
}
.form-group-highlight textarea {
  background:white;
  border:1px solid rgba(60, 173, 195, .3);
  min-height:90px;
}
.form-group-highlight textarea:focus {
  border-color:var(--teal); outline:none;
  box-shadow:0 0 0 3px rgba(60, 173, 195, .15);
}
.form-group-highlight .form-hint {
  background:rgba(248, 207, 95, .12);
  border-left:3px solid var(--yellow);
  padding:.5rem .7rem; border-radius:4px;
  margin-top:.6rem; font-style:italic;
}

/* Bannière contextuelle dans le wizard (ex: >50 salariés) */
.wizard-banner {
  margin-top:1rem; padding:1rem 1.2rem;
  border-radius:10px; font-size:.92rem; line-height:1.55;
  animation:step-in .35s cubic-bezier(.2,.8,.2,1) both;
}
.wizard-banner-info {
  background:rgba(60, 173, 195, .08);
  border-left:4px solid var(--teal);
  color:var(--text-md);
}
.wizard-banner a { color:var(--teal-xdk); font-weight:700; text-decoration:underline; }
.wizard-banner strong { color:var(--text); }

/* ════════ SUCCESS PAGE ════════ */
.success-wrap {
  max-width:640px; margin:5rem auto; padding:2.5rem;
  background:white; border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg); text-align:center;
}
.success-icon {
  width:80px; height:80px; margin:0 auto 1.5rem;
  background:linear-gradient(135deg, var(--success), #16a085);
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  color:white; font-size:2.5rem;
  box-shadow:0 12px 32px rgba(46,204,113,0.4);
}
.success-wrap h1 { margin-bottom:1rem; font-size:2rem; }
.success-wrap p { color:var(--text-md); font-size:1.05rem; margin-bottom:1.6rem; }

/* ════════ RESPONSIVE ════════ */
@media (max-width: 880px) {
  .hero-inner { grid-template-columns:1fr; gap:2rem; text-align:center; }
  .hero-trust { justify-content:center; }
  .hero-cta-row { justify-content:center; }
  .hero-visual { order:-1; padding:20px 30px; max-width:420px; margin:0 auto; }
  .hero-floating-card { left:50%; transform:translateX(-50%); bottom:-15px; }
  /* Logos rapetissés sur mobile */
  .hero-logo { width:50px; height:50px; padding:5px; }
  .hero-logo-qualiopi   { top:-8px; left:8px; }
  .hero-logo-mintravail { top:30%; left:-18px; }
  .hero-logo-inrs       { bottom:32%; left:-18px; }
  .hero-logo-carsat     { top:30%; right:-18px; }
  .hero-logo-cnam       { bottom:32%; right:-18px; }
  .hero-iprp-badge { width:64px; height:64px; top:4px; right:4px; }
  .compare-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; gap:2rem; }
  .pricing-wrap { grid-template-columns:1fr; }
  .header-nav { display:none; }
  .floating-cta { padding:.8rem 1.2rem; font-size:.9rem; bottom:15px; right:15px; }
  .wizard-container { padding:1.5rem; }
}
