/* landing.css — styles propres aux deux pages d'atterrissage de campagne.
   Isole de styles.css pour ne rien modifier des pages du site.
   Jetons repris de styles.css (--navy, --gold, --teal-text, --slate-*). */

/* En-tete minimale : pas de menu, pas de lien sortant. */
.lp-header{background:var(--navy);position:relative;z-index:5}
.lp-header-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;
  min-height:74px;padding-top:12px;padding-bottom:12px;flex-wrap:wrap}
.brand-static{display:inline-flex;align-items:center;gap:12px}
/* styles.css met .brand-word en navy (en-tete claire du site) : sur le bandeau
   sombre d'une landing, il faut le repasser en blanc, sinon le mot disparait. */
.lp-header .brand-word{color:var(--white)}
.lp-header .brand-word em{font-style:normal;color:var(--gold)}
.lp-header .brand img{background:var(--white);border-radius:12px;padding:5px;
  box-shadow:0 2px 10px rgba(0,0,0,.28)}
.lp-header-bar .btn{white-space:normal;text-align:center}

/* Heros */
.lp-cta-line{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:30px}
.lp-cta-note{font-size:14.5px;color:var(--slate-300)}
.lp-reassurance{margin-top:22px;font-size:14.5px;color:var(--slate-300);max-width:70ch}

/* Qualification de cible, en tete de la section probleme */
.lp-qualif{display:inline-block;background:rgba(14,116,144,.09);border:1px solid rgba(14,116,144,.28);
  color:var(--teal-text);border-radius:999px;padding:10px 20px;font-size:14.5px;font-weight:600;
  margin-bottom:26px}

.lp-gap{margin-top:34px}

/* Chaine des trois agents */
.lp-chain{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;margin-top:34px;
  list-style:none;padding:0;counter-reset:none}
.lp-chain li{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  border-radius:20px;padding:26px}
.lp-chain-num{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;
  border-radius:12px;background:var(--gold);color:var(--navy);font-weight:800;font-size:16px}
.lp-chain h3{margin-top:16px;font-size:19px;font-weight:700;color:var(--white)}
.lp-chain p{margin-top:10px;font-size:15.5px;line-height:1.6;color:rgba(255,255,255,.86)}
.lp-tech{margin-top:26px;font-size:15px;color:rgba(255,255,255,.8)}

/* Tableaux de perimetre et de partage des roles */
.lp-table-wrap{margin-top:30px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.lp-table{width:100%;min-width:520px;border-collapse:collapse;background:var(--white);
  border:1px solid var(--slate-200);border-radius:18px;overflow:hidden}
.lp-table th{background:var(--navy);color:var(--white);text-align:left;padding:16px 20px;
  font-size:15px;font-weight:700}
.lp-table td{padding:18px 20px;font-size:15.5px;line-height:1.6;color:var(--slate-700);
  border-top:1px solid var(--slate-200);vertical-align:top}
.lp-table td + td{background:var(--offwhite);font-weight:600;color:var(--navy)}

.section-offwhite{background:var(--offwhite);padding:clamp(56px,7vw,104px) 0}
.lp-steps{margin-top:32px}

/* Phrase de motif : elle porte l'argument, elle se voit. */
.lp-motif{margin-top:30px;padding:24px 26px;background:rgba(15,43,70,.05);
  border-left:4px solid var(--navy);border-radius:0 14px 14px 0;
  font-size:16.5px;line-height:1.62;color:var(--navy)}

.lp-statut{margin-top:30px;padding:0;list-style:none;display:grid;gap:10px}
.lp-statut li{position:relative;padding-left:26px;font-size:15px;line-height:1.6;color:var(--slate-600)}
.lp-statut li::before{content:"";position:absolute;left:0;top:9px;width:9px;height:9px;
  border-radius:50%;background:var(--slate-400)}

/* Encart de franchise sur l'acces technique */
.lp-franchise{margin-top:34px;padding:28px 30px;background:var(--offwhite);
  border:1px solid var(--slate-200);border-radius:20px}
.lp-franchise h3{font-size:19px;font-weight:700;color:var(--navy)}
.lp-franchise p{margin-top:12px;font-size:15.5px;line-height:1.65;color:var(--slate-600);max-width:70ch}

/* Fondateur */
.lp-founder{display:grid;grid-template-columns:minmax(200px,280px) 1fr;gap:40px;align-items:center}
.lp-founder img{width:100%;height:auto;border-radius:22px;display:block}
.lp-founder p{margin-top:14px;font-size:16px;line-height:1.68;color:var(--slate-600);max-width:64ch}
.lp-identite{font-size:14.5px}

/* FAQ : contenu present dans le HTML, ouvert par le navigateur */
.lp-faq{margin-top:32px;display:grid;gap:12px;max-width:80ch}
.lp-faq details{background:var(--white);border:1px solid var(--slate-200);border-radius:16px;
  padding:18px 22px}
.lp-faq summary{cursor:pointer;font-weight:700;font-size:16.5px;color:var(--navy);list-style:none}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq summary::after{content:"+";float:right;font-weight:700;color:var(--teal-text)}
.lp-faq details[open] summary::after{content:"−"}
.lp-faq p{margin-top:14px;font-size:15.5px;line-height:1.65;color:var(--slate-600)}

/* Bloc de conversion */
.lp-convert{display:grid;grid-template-columns:1fr minmax(320px,480px);gap:48px;align-items:start}
.lp-form{background:var(--white);border-radius:24px;padding:30px;display:grid;gap:16px}
.lp-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.lp-form label{font-size:14px;font-weight:600;color:var(--navy)}
.lp-form input[type=text],.lp-form input[type=email],.lp-form input[type=tel],
.lp-form select,.lp-form textarea{width:100%;padding:12px 14px;border:1.5px solid var(--slate-300);
  border-radius:12px;font:inherit;font-size:15px;color:var(--navy);background:var(--white)}
.lp-form textarea{resize:vertical}
/* Telephone : indicatif obligatoire a gauche, numero a droite.
   Colonne bornee : sans cela, l'option la plus longue impose sa largeur
   et le champ du numero se reduit a quelques pixels. */
.lp-tel{display:grid;grid-template-columns:150px minmax(0,1fr);gap:10px}
.lp-tel select{min-width:0;text-overflow:ellipsis}
@media (max-width:480px){.lp-tel{grid-template-columns:1fr}}
.lp-form input:focus-visible,.lp-form select:focus-visible,.lp-form textarea:focus-visible{
  outline:2px solid var(--teal-text);outline-offset:1px;border-color:var(--teal-text)}
.lp-consent{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.55;
  color:var(--slate-600);font-weight:400}
.lp-consent input{margin-top:3px;width:18px;height:18px;flex-shrink:0}
.lp-consent a{color:var(--teal-text);text-decoration:underline}
.lp-form-note{font-size:13.5px;line-height:1.55;color:var(--slate-600)}
.lp-sent{background:var(--white);border-radius:24px;padding:34px}
.lp-sent h2{font-size:23px;color:var(--navy)}
.lp-sent p{margin-top:14px;font-size:15.5px;line-height:1.65;color:var(--slate-600)}

/* Pied de page */
.lp-footer{background:var(--navy-deep);color:var(--slate-300);padding:44px 0}
.lp-footer-id{font-size:14.5px;color:var(--white);font-weight:600}
.lp-footer-links{margin-top:16px;display:flex;flex-wrap:wrap;gap:10px 26px}
.lp-footer-links a{color:var(--slate-300);font-size:14.5px;text-decoration:underline}
.lp-footer-links a:hover{color:var(--white)}
.lp-footer-copy{margin-top:20px;font-size:13.5px;color:var(--slate-400)}

@media (max-width:860px){
  .lp-convert{grid-template-columns:1fr;gap:32px}
  .lp-founder{grid-template-columns:1fr;gap:26px}
  .lp-founder picture{max-width:260px;display:block}
}
@media (max-width:560px){
  .lp-row{grid-template-columns:1fr}
  .lp-header-bar{min-height:0}
  .lp-header-bar .btn{width:100%}
  .lp-table{min-width:420px}
}