/*
 * Les Pratiques du Manager | Offre entreprises
 * CSS V5 compatible avec le contenu CMS corrigé (blocs <div>).
 * Remplacer intégralement themes/mgo8/assets/css/lpdm-entreprises.css
 * et utiliser en parallèle page-cms-entreprises-v5.html.
 * Le formulaire Smarty et le traitement PHP ne changent pas.
 */

/* Masque le titre CMS redondant, uniquement lorsque la page contient ce bloc.
   Nécessite un navigateur moderne prenant en charge :has(). */
body:has(#lpdm-entreprises) #main .page-header {
  display: none;
}

#lpdm-entreprises {
  --lp-accent: #79aa39;
  --lp-accent-strong: #56842a;
  --lp-accent-soft: #f3f7eb;
  --lp-text: #343b35;
  --lp-muted: #606b60;
  --lp-border: #dfe6d8;
  --lp-paper: #fff;
  --lp-tint: #f8faf5;
  width: 100%;
  max-width: 100%;
  margin: 0;
  color: var(--lp-text);
  background: transparent;
  font-family: inherit;
  font-size: 16px;
  line-height: 1.62;
  overflow-wrap: anywhere;
}

#lpdm-entreprises *,
#lpdm-entreprises *::before,
#lpdm-entreprises *::after { box-sizing: border-box; }

#lpdm-entreprises :is(h1, h2, h3, p, ul) { margin: 0; padding: 0; }
#lpdm-entreprises :is(h1, h2, h3) {
  color: var(--lp-text);
  font-family: inherit;
  font-style: normal;
  text-transform: none;
  letter-spacing: normal;
}
#lpdm-entreprises h1 { font-size: clamp(32px, 3.2vw, 43px); line-height: 1.16; font-weight: 700; }
#lpdm-entreprises h2 { font-size: clamp(25px, 2.4vw, 32px); line-height: 1.22; font-weight: 700; }
#lpdm-entreprises h3 { font-size: 19px; line-height: 1.34; font-weight: 700; }
#lpdm-entreprises p { color: var(--lp-muted); line-height: 1.65; }
#lpdm-entreprises img { max-width: 100%; height: auto; display: block; }
#lpdm-entreprises a { text-decoration: none; }
#lpdm-entreprises :is(input, textarea, select, button) { font: inherit; }
#lpdm-entreprises button { cursor: pointer; }
#lpdm-entreprises :is(a, button, input, select, textarea):focus-visible {
  outline: 3px solid #b1cf8b;
  outline-offset: 2px;
}

/* Largeur : s'adapte au conteneur PrestaShop sans provoquer de débordement. */
#lpdm-entreprises .lp-container {
  width: 100%;
  max-width: 1140px;
  min-width: 0;
  margin-left: auto;
  margin-right: auto;
  padding-left: 18px;
  padding-right: 18px;
}
#lpdm-entreprises .lp-section { padding: 60px 0; }
#lpdm-entreprises .lp-label,
#lpdm-entreprises .lp-tag {
  display: block;
  color: var(--lp-accent-strong);
  font-weight: 700;
  font-size: 13px;
  line-height: 1.35;
  margin-bottom: 11px;
}
#lpdm-entreprises .lp-section-lead { max-width: 750px; margin-bottom: 29px; }
#lpdm-entreprises .lp-intro { font-size: 16px; margin-top: 14px; line-height: 1.7; }

/* Boutons */
#lpdm-entreprises .lp-btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  min-height: 45px;
  max-width: 100%;
  padding: 10px 18px;
  border: 1px solid transparent;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
  transition: background-color .15s ease, border-color .15s ease;
}
#lpdm-entreprises .lp-btn-main { background: var(--lp-accent); border-color: var(--lp-accent); color: white; }
#lpdm-entreprises .lp-btn-main:hover { background: var(--lp-accent-strong); border-color: var(--lp-accent-strong); color: white; }
#lpdm-entreprises .lp-btn-alt { background: white; color: var(--lp-accent-strong); border-color: #b8cba8; }
#lpdm-entreprises .lp-btn-alt:hover { background: var(--lp-accent-soft); color: var(--lp-accent-strong); }
#lpdm-entreprises .lp-btn:disabled { opacity: .5; cursor: not-allowed; }

/* Bandeau d'ouverture */
#lpdm-entreprises .lp-hero {
  background: var(--lp-paper);
  border-bottom: 1px solid var(--lp-border);
  padding: 37px 0 50px;
}
#lpdm-entreprises .lp-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: 34px;
}
#lpdm-entreprises .lp-hero-grid > * { min-width: 0; }
#lpdm-entreprises .lp-hero h1 span { color: var(--lp-accent-strong); }
#lpdm-entreprises .lp-hero p { font-size: 17px; margin-top: 17px; }
#lpdm-entreprises .lp-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
#lpdm-entreprises .lp-hero-image {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border: 1px solid #edf0e8;
  border-radius: 5px;
}
#lpdm-entreprises .lp-hero-note { font-size: 12px; color: #778175; text-align: right; margin-top: 8px; }
#lpdm-entreprises .lp-chips { display: flex; flex-wrap: wrap; gap: 9px 17px; margin-top: 22px; }
#lpdm-entreprises .lp-chips > span { display: inline-flex; align-items: center; gap: 7px; color: #566651; font-size: 13px; }
#lpdm-entreprises .lp-check {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  color: var(--lp-accent-strong);
  background: #eaf4df;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
}

/* Les cartes exigent les DIV .lp-benefit du HTML V4. L'éditeur PrestaShop
   supprimait auparavant les balises <article>, d'où la grille disloquée. */
#lpdm-entreprises .lp-benefits {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
}
#lpdm-entreprises .lp-benefit {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 25px 23px;
  background: white;
  border: 1px solid var(--lp-border);
  border-top: 3px solid var(--lp-accent);
  border-radius: 5px;
}
#lpdm-entreprises .lp-icon { display: block; margin-bottom: 16px; color: var(--lp-accent-strong); font-size: 27px; line-height: 1; }
#lpdm-entreprises .lp-benefit h3 { font-size: 18px; }
#lpdm-entreprises .lp-benefit p { font-size: 15px; margin-top: 10px; }

/* Bibliothèque et typologies */
#lpdm-entreprises .lp-tint {
  background: var(--lp-tint);
  border-top: 1px solid #eef2e9;
  border-bottom: 1px solid #eef2e9;
}
#lpdm-entreprises .lp-library-grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: 36px;
  align-items: center;
}
#lpdm-entreprises .lp-library-grid > * { min-width: 0; }
#lpdm-entreprises .lp-library-art {
  border: 1px solid var(--lp-border);
  border-radius: 5px;
  background: white;
  overflow: hidden;
}
#lpdm-entreprises .lp-list { margin: 22px 0 0 !important; padding: 0 !important; list-style: none !important; }
#lpdm-entreprises .lp-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 12px !important;
  color: var(--lp-muted);
  font-size: 15px;
  line-height: 1.6;
}
#lpdm-entreprises .lp-list li > span:last-child { min-width: 0; }
#lpdm-entreprises .lp-list b { color: var(--lp-text); }
#lpdm-entreprises .lp-topics { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 20px; }
#lpdm-entreprises .lp-topic { display: inline-block; padding: 6px 10px; background: white; border: 1px solid #dce7d2; border-radius: 4px; color: #526d48; font-size: 13px; }

/* Déploiement : un bloc par étape, pas trois cellules séparées */
#lpdm-entreprises .lp-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  margin-top: 28px;
}
#lpdm-entreprises .lp-step {
  min-width: 0;
  padding: 19px 0 0;
  border-top: 2px solid var(--lp-border);
}
#lpdm-entreprises .lp-step-no { color: var(--lp-accent-strong); font-size: 26px; font-weight: 700; line-height: 1; margin-bottom: 16px; }
#lpdm-entreprises .lp-step h3 { font-size: 17px; }
#lpdm-entreprises .lp-step p { margin-top: 10px; font-size: 14px; line-height: 1.62; }
#lpdm-entreprises .lp-flow-image {
  width: 100%;
  border: 1px solid var(--lp-border);
  border-radius: 5px;
  margin-top: 30px;
  background: white;
}

/* Deux licences commerciales indépendantes, option MAJ dans la licence permanente */
#lpdm-entreprises .lp-offer {
  background: var(--lp-tint);
  border-top: 1px solid #eef2e9;
  border-bottom: 1px solid #eef2e9;
}
#lpdm-entreprises .lp-offer-grid {
  display: block;
}
#lpdm-entreprises .lp-offer-intro {
  max-width: 800px;
  margin-bottom: 27px;
}
#lpdm-entreprises .lp-offer-grid > * { min-width: 0; }
#lpdm-entreprises .lp-offer-fine { font-size: 13px; margin-top: 20px; max-width: 880px; }
#lpdm-entreprises .lp-plans {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 21px;
}
#lpdm-entreprises .lp-plan {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 26px 27px;
  border: 1px solid var(--lp-border);
  border-top: 3px solid var(--lp-accent);
  border-radius: 5px;
  background: white;
}
#lpdm-entreprises .lp-plan-annuelle { border-top-color: #b7cda5; }
#lpdm-entreprises .lp-plan-label { display: block; color: var(--lp-accent-strong); font-size: 12px; font-weight: 700; margin-bottom: 11px; }
#lpdm-entreprises .lp-plan h3 { font-size: 21px; }
#lpdm-entreprises .lp-plan p { font-size: 15px; margin-top: 12px; }
#lpdm-entreprises .lp-plan ul { padding: 0 0 0 20px !important; margin: 19px 0 23px !important; color: var(--lp-muted); font-size: 14px; line-height: 1.6; }
#lpdm-entreprises .lp-plan li { margin-bottom: 8px; }
#lpdm-entreprises .lp-plan .lp-btn { margin-top: 2px; }
#lpdm-entreprises .lp-price {
  margin: auto 0 14px;
  padding-top: 16px;
  border-top: 1px solid var(--lp-border);
  color: var(--lp-accent-strong);
  font-size: 24px;
  line-height: 1.2;
  font-weight: 700;
}
#lpdm-entreprises .lp-plan .lp-btn { width: 100%; }

/* FAQ V4 : questions affichées sans <details>/<summary> car CMS peut les retirer. */
#lpdm-entreprises .lp-faq-grid {
  display: grid;
  grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr);
  gap: 39px;
  align-items: start;
}
#lpdm-entreprises .lp-faq-grid > * { min-width: 0; }
#lpdm-entreprises .lp-faq {
  display: block;
  padding: 15px 0 17px;
  border-bottom: 1px solid var(--lp-border);
}
#lpdm-entreprises .lp-faq:first-child { padding-top: 0; }
#lpdm-entreprises .lp-faq h3 { font-size: 16px; line-height: 1.45; font-weight: 700; margin: 0 0 7px; }
#lpdm-entreprises .lp-faq p { font-size: 14px; line-height: 1.6; margin: 0; }

/* Formulaire chargé en Smarty, conservé dans la même enveloppe #lpdm-entreprises. */
#lpdm-entreprises .lp-contact {
  padding: 61px 0;
  background: var(--lp-accent-soft);
  border-top: 1px solid var(--lp-border);
}
#lpdm-entreprises .lp-contact-grid {
  display: grid;
  grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
  gap: 33px;
  align-items: start;
}
#lpdm-entreprises .lp-contact-grid > * { min-width: 0; }
#lpdm-entreprises .lp-contact-copy p { margin-top: 17px; font-size: 16px; }
#lpdm-entreprises .lp-contact-points { display: grid; gap: 11px; margin-top: 22px; color: #52664c; font-size: 14px; }
#lpdm-entreprises .lp-form {
  min-width: 0;
  padding: 29px 28px;
  border: 1px solid #d5e0cb;
  border-radius: 6px;
  background: white;
  color: var(--lp-text);
}
#lpdm-entreprises .lp-form h3 { font-size: 22px; margin-bottom: 6px; }
#lpdm-entreprises .lp-form > p { font-size: 14px; margin-bottom: 20px; }
#lpdm-entreprises .lp-field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
#lpdm-entreprises .lp-field { min-width: 0; margin-bottom: 16px; }
#lpdm-entreprises .lp-field label { display: block; margin-bottom: 7px; color: var(--lp-text); font-size: 13px; font-weight: 700; }
#lpdm-entreprises :is(.lp-field input, .lp-field select, .lp-field textarea) {
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: 44px !important;
  padding: 10px 12px !important;
  border: 1px solid #cbd4c5 !important;
  border-radius: 4px !important;
  background: white !important;
  box-shadow: none !important;
  color: var(--lp-text) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}
#lpdm-entreprises .lp-field textarea { min-height: 110px !important; resize: vertical; }
#lpdm-entreprises .lp-field :is(input, select, textarea):focus {
  border-color: var(--lp-accent-strong) !important;
  box-shadow: 0 0 0 3px rgb(121 170 57 / 15%) !important;
}
#lpdm-entreprises .lp-info { margin: 1px 0 15px; color: #687668; font-size: 12px; line-height: 1.6; }
#lpdm-entreprises .lp-info a { color: var(--lp-accent-strong); text-decoration: underline; }
#lpdm-entreprises .lp-status { margin-top: 13px; color: #52664c; font-size: 13px; }
#lpdm-entreprises .lp-status[data-state="error"] { color: #a02d30; }
#lpdm-entreprises .lp-status[data-state="success"] { color: var(--lp-accent-strong); }
#lpdm-entreprises .lp-visually-hidden {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* Les colonnes doivent basculer avant d'être comprimées dans le thème. */
@media (max-width: 1199px) {
  #lpdm-entreprises .lp-offer-grid { grid-template-columns: 1fr; gap: 26px; }
  #lpdm-entreprises .lp-plan { padding: 23px; }
}
@media (max-width: 991px) {
  #lpdm-entreprises .lp-hero-grid,
  #lpdm-entreprises .lp-library-grid,
  #lpdm-entreprises .lp-contact-grid,
  #lpdm-entreprises .lp-faq-grid { grid-template-columns: 1fr; gap: 27px; }
  #lpdm-entreprises .lp-benefits { gap: 12px; }
  #lpdm-entreprises .lp-benefit { padding: 20px 17px; }
  #lpdm-entreprises .lp-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #lpdm-entreprises .lp-library-art { max-width: 640px; }
  #lpdm-entreprises .lp-hero-image { max-height: 460px; }
  #lpdm-entreprises .lp-hero-note { text-align: left; }
}
@media (max-width: 700px) {
  #lpdm-entreprises { font-size: 15px; }
  #lpdm-entreprises .lp-container { padding: 0 13px; }
  #lpdm-entreprises .lp-section { padding: 41px 0; }
  #lpdm-entreprises .lp-hero { padding: 25px 0 35px; }
  #lpdm-entreprises h1 { font-size: clamp(29px, 7vw, 36px); }
  #lpdm-entreprises h2 { font-size: 25px; }
  #lpdm-entreprises .lp-hero p { font-size: 16px; }
  #lpdm-entreprises .lp-benefits,
  #lpdm-entreprises .lp-plans,
  #lpdm-entreprises .lp-field-row { grid-template-columns: 1fr; }
  #lpdm-entreprises .lp-benefit { padding: 22px; }
  #lpdm-entreprises .lp-actions .lp-btn { width: 100%; }
  #lpdm-entreprises .lp-form { padding: 22px 17px; }
  #lpdm-entreprises .lp-contact { padding: 43px 0; }
}
@media (max-width: 420px) {
  #lpdm-entreprises .lp-steps { grid-template-columns: 1fr; gap: 17px; }
  #lpdm-entreprises .lp-chips { display: grid; gap: 8px; }
}

/* Puces des listes classiques : priorité sur les styles du thème mgo8.
   La liste .lp-list garde ses coches vertes personnalisées. */
#lpdm-entreprises ul:not(.lp-list) {
  list-style: disc outside !important;
  padding-left: 1.5rem !important;
}

#lpdm-entreprises ul:not(.lp-list) > li {
  display: list-item !important;
  list-style: disc outside !important;
  padding-left: 0 !important;
}

#lpdm-entreprises ul:not(.lp-list) > li::marker {
  color: var(--lp-accent-strong);
}