:root{--bleu:#2b6cb0;--bleu-fonce:#1a4a80;--encre:#1f2933;--gris:#52606d;--gris-clair:#e4e9ef;--fond:#f5f7fa;--blanc:#fff;
      --vert:#2f855a;--orange:#c05621;--rouge:#c53030;--ombre:0 1px 3px rgba(0,0,0,.08)}
*{box-sizing:border-box}
body{margin:0;font-family:"Segoe UI",system-ui,-apple-system,sans-serif;color:var(--encre);background:var(--fond);line-height:1.5}
a{color:var(--bleu)}

/* ---------- En-tête ---------- */
.entete{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;padding:.7rem 1.5rem;background:var(--blanc);border-bottom:3px solid var(--bleu);box-shadow:var(--ombre);position:sticky;top:0;z-index:5}
.entete-gauche{display:flex;align-items:center;gap:1rem}
.marque{display:flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--bleu-fonce)}
.marque .initiale{display:inline-grid;place-items:center;width:2.2rem;height:2.2rem;border-radius:50%;background:var(--bleu);color:#fff;font-weight:700;font-size:1.2rem}
.marque .nom{font-size:1.35rem;font-weight:700;letter-spacing:.02em}
.accroche{color:var(--gris);font-size:.9rem}
.entete-centre{text-align:center}
.etiquette{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--gris)}
.client{font-size:1.15rem}
.cloison{display:block;font-size:.75rem;color:var(--vert)}
.entete-droite{display:flex;justify-content:flex-end;align-items:center;gap:1.2rem}
.date{color:var(--gris);font-size:.9rem}
.compte{font-size:.85rem;color:var(--gris)}.compte a{color:var(--bleu)}
.connexion{max-width:560px;margin:2rem auto}
.jauge{display:grid;grid-template-columns:auto 120px auto;align-items:center;gap:.5rem;text-decoration:none;color:var(--encre);font-size:.82rem}
.jauge-barre{display:block;height:.55rem;background:var(--gris-clair);border-radius:1rem;overflow:hidden}
.jauge-remplissage{display:block;height:100%;background:var(--vert)}
.jauge-remplissage.orange{background:var(--orange)}.jauge-remplissage.rouge{background:var(--rouge)}

/* ---------- Structure ---------- */
.page{display:grid;grid-template-columns:220px 1fr;min-height:calc(100vh - 8rem)}
.menu{background:var(--blanc);border-right:1px solid var(--gris-clair);padding:1rem 0;display:flex;flex-direction:column}
.menu a{padding:.6rem 1.4rem;text-decoration:none;color:var(--encre);border-left:3px solid transparent}
.menu a:hover{background:var(--fond)}
.menu a.actif{border-left-color:var(--bleu);color:var(--bleu);font-weight:600;background:#ebf4ff}
.menu .retour{margin-top:auto;color:var(--gris);font-size:.85rem}
.contenu{padding:1.5rem 2rem;max-width:1200px}
.page:not(:has(> .menu)){grid-template-columns:1fr}.page:not(:has(> .menu)) .contenu{margin:0 auto;width:100%}
.pied{padding:.8rem 1.5rem;font-size:.8rem;color:var(--gris);border-top:1px solid var(--gris-clair);background:var(--blanc)}
h1{font-size:1.45rem;margin:.2rem 0 1rem}h2{font-size:1.15rem;color:var(--bleu-fonce);margin:1.6rem 0 .6rem}h3{font-size:1rem;margin:1rem 0 .4rem}

/* ---------- Composants ---------- */
.cartes{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1rem;margin-bottom:1.2rem}
.carte{background:var(--blanc);border-radius:.6rem;padding:1rem 1.2rem;box-shadow:var(--ombre)}
.carte .chiffre{font-size:2rem;font-weight:700;color:var(--bleu-fonce);line-height:1.1}
.carte .libelle{color:var(--gris);font-size:.85rem}
.carte.vert .chiffre{color:var(--vert)}.carte.orange .chiffre{color:var(--orange)}
.bloc{background:var(--blanc);border-radius:.6rem;padding:1rem 1.2rem;box-shadow:var(--ombre);margin-bottom:1.2rem}
.deux-colonnes{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
@media(max-width:900px){.page{grid-template-columns:1fr}.menu{flex-direction:row;flex-wrap:wrap}.deux-colonnes{grid-template-columns:1fr}.entete{grid-template-columns:1fr}}
table{border-collapse:collapse;width:100%;font-size:.9rem;background:var(--blanc)}
th,td{border-bottom:1px solid var(--gris-clair);padding:.45rem .6rem;text-align:left;vertical-align:top}
th{background:#f0f4f8;font-weight:600;font-size:.82rem;text-transform:uppercase;letter-spacing:.03em;color:var(--gris)}
.badge{display:inline-block;padding:.1rem .5rem;border-radius:1rem;font-size:.78rem;font-weight:600;white-space:nowrap}
.badge.FONDE{background:#c6f6d5;color:#22543d}.badge.A_VERIFIER{background:#feebc8;color:#7b341e}.badge.REJETE{background:#fed7d7;color:#742a2a}
.badge.client{background:#bee3f8;color:#2a4365}.badge.tiers{background:#e9d8fd;color:#44337a}.badge.indetermine{background:var(--gris-clair);color:var(--gris)}
.badge.en_attente{background:var(--gris-clair)}.badge.en_cours{background:#bee3f8;color:#2a4365}.badge.terminee{background:#c6f6d5;color:#22543d}.badge.erreur{background:#fed7d7;color:#742a2a}
.bandeau{padding:.7rem 1rem;border-radius:.5rem;margin-bottom:1rem;font-weight:600}
.bandeau.rouge{background:#fed7d7;color:#742a2a}.bandeau.orange{background:#feebc8;color:#7b341e}
.bouton{display:inline-block;background:var(--bleu);color:#fff;border:0;border-radius:.4rem;padding:.55rem 1.1rem;font-size:.95rem;cursor:pointer;text-decoration:none}
.bouton:hover{background:var(--bleu-fonce)}.bouton.secondaire{background:var(--blanc);color:var(--bleu);border:1px solid var(--bleu)}
input[type=text],input[type=password],input[type=file],select,textarea{width:100%;padding:.5rem .6rem;border:1px solid #cbd5e0;border-radius:.4rem;font:inherit}
label{display:block;font-size:.85rem;color:var(--gris);margin:.6rem 0 .2rem}
.zone-depot{border:2px dashed #a0aec0;border-radius:.6rem;padding:1.2rem;text-align:center;color:var(--gris);background:#fafcff}
.zone-depot.survol{border-color:var(--bleu);background:#ebf4ff}
.arbre .categorie{margin-bottom:1rem}
.arbre .categorie h3{display:flex;align-items:center;gap:.5rem;margin-bottom:.3rem}
.arbre .categorie h3 .compte{font-size:.8rem;color:var(--gris);font-weight:400}
.doc{display:grid;grid-template-columns:100px 1fr auto;gap:.8rem;align-items:center;padding:.5rem .6rem;border-radius:.4rem}
.doc:hover{background:var(--fond)}
.doc .date{color:var(--gris);font-size:.85rem}.doc .stats{font-size:.82rem;color:var(--gris);white-space:nowrap}
.journal{font-family:Consolas,monospace;font-size:.8rem;background:#f7fafc;border:1px solid var(--gris-clair);padding:.5rem .7rem;border-radius:.4rem;white-space:pre-wrap;max-height:200px;overflow:auto}
.julie{background:#ebf4ff;border-left:4px solid var(--bleu);padding:1rem 1.2rem;border-radius:.4rem;white-space:pre-wrap;line-height:1.55}
.julie .signature{display:block;margin-top:.6rem;color:var(--bleu-fonce);font-weight:600}
.rapport h1{font-size:1.4rem}.rapport table{margin:.5rem 0 1rem}.rapport blockquote{border-left:4px solid #cbd5e0;margin:.4rem 0;padding:.3rem .8rem;color:#4a5568;background:#f7fafc}
.rapport h2{border-bottom:1px solid var(--gris-clair);padding-bottom:.2rem}
.fichiers a{margin-right:.8rem;font-size:.85rem}
.filtres{display:flex;gap:.6rem;align-items:end;margin-bottom:1rem}.filtres label{margin:0}
.vide{color:var(--gris);font-style:italic}
.J{font-variant-numeric:tabular-nums}

/* ---------- Accueil public ---------- */
.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:2rem;align-items:center;background:var(--blanc);border-radius:.8rem;padding:2rem;box-shadow:var(--ombre);margin-bottom:1.5rem}
.hero h1{font-size:2rem;margin:0 0 .6rem}
.hero-texte{font-size:1.05rem;color:var(--gris)}
.hero-promesses{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.promesse{background:#ebf4ff;border-radius:.6rem;padding:.9rem 1rem;display:flex;flex-direction:column;gap:.25rem}
.promesse strong{color:var(--bleu-fonce)}.promesse span{font-size:.85rem;color:var(--gris)}
.grille-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.grille-4>div{border-left:3px solid var(--bleu);padding-left:.8rem}
.formules{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin:1.2rem 0}
.formule{position:relative;background:var(--blanc);border:1px solid var(--gris-clair);border-radius:.8rem;padding:1.4rem;box-shadow:var(--ombre)}
.formule.mise-en-avant{border:2px solid var(--bleu);transform:translateY(-6px)}
.formule h3{margin:0;font-size:1.25rem;color:var(--bleu-fonce)}
.formule .tarif{font-size:1.5rem;font-weight:700;margin:.3rem 0 .6rem}
.formule .pour-qui{color:var(--gris);font-size:.9rem;min-height:3.2rem}
.formule .chiffres{list-style:none;padding:0;margin:.6rem 0;border-top:1px solid var(--gris-clair);border-bottom:1px solid var(--gris-clair)}
.formule .chiffres li{padding:.35rem 0}.formule .chiffres strong{font-size:1.15rem;color:var(--bleu-fonce)}
.formule .inclus{padding-left:1.1rem;font-size:.9rem;margin:.6rem 0 0}.formule .inclus li{margin:.2rem 0}
.ruban{position:absolute;top:-.8rem;right:1rem;background:var(--bleu);color:#fff;font-size:.72rem;padding:.2rem .7rem;border-radius:1rem;text-transform:uppercase;letter-spacing:.05em}
@media(max-width:900px){.hero,.hero-promesses,.grille-4,.formules{grid-template-columns:1fr}.formule.mise-en-avant{transform:none}}
/* ---------- Choix de formule (inscription) ---------- */
.formules.choix{max-width:1100px;margin:1rem auto}
.formules.choix .formule{cursor:pointer;display:block}
.formules.choix .formule input[type=radio]{position:absolute;top:1rem;right:1rem;width:1.2rem;height:1.2rem}
.formules.choix .formule:has(input:checked){border:2px solid var(--bleu);background:#f4f9ff}
.formules.choix .formule.mise-en-avant{transform:none}
.connexion .deux-colonnes{gap:.8rem}
/* ---------- Accueil : marketing ---------- */
.surtitre{text-transform:uppercase;letter-spacing:.1em;font-size:.75rem;color:var(--bleu);font-weight:600;margin:0 0 .4rem}
.hero h1{font-size:2.1rem;line-height:1.2;margin:0 0 .8rem}
.mini{font-size:.82rem;color:var(--gris)}
.centre{text-align:center}
section{margin-bottom:1.6rem}
section h2{font-size:1.35rem}
.bandeau-sobre{background:#1a4a80;color:#fff}.bandeau-sobre h2{color:#fff;margin-top:0}.bandeau-sobre p{color:#dbe7f5;font-size:.92rem}
.grille-2{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.grille-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.grille-3 p,.grille-2 p{margin:.3rem 0 0;font-size:.92rem;color:var(--gris)}
.bloc .grille-3>div{border-left:3px solid var(--bleu);padding-left:.8rem}
.confiance{background:#f4f9ff;border:1px solid #d6e6f7}
.etapes{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin:1rem 0 .6rem}
.etape{background:var(--blanc);border-radius:.8rem;padding:1.2rem 1.3rem 1.2rem 3.6rem;position:relative;box-shadow:var(--ombre)}
.etape .num{position:absolute;left:1.1rem;top:1.1rem;width:1.8rem;height:1.8rem;border-radius:50%;background:var(--bleu);color:#fff;display:grid;place-items:center;font-weight:700}
.etape p{margin:.3rem 0 0;font-size:.92rem;color:var(--gris)}
.carte p{margin:.3rem 0 0;font-size:.92rem;color:var(--gris)}
.faq details{border-bottom:1px solid var(--gris-clair);padding:.5rem 0}
.faq summary{cursor:pointer;font-weight:600;color:var(--bleu-fonce)}
.faq p{margin:.4rem 0 .2rem;color:var(--gris);font-size:.93rem}
.final{background:var(--blanc);border-radius:.8rem;padding:2rem;text-align:center;box-shadow:var(--ombre);border-top:4px solid var(--bleu)}
.final h2{margin-top:0;font-size:1.5rem}
@media(max-width:900px){.grille-2,.grille-3,.etapes{grid-template-columns:1fr}.hero h1{font-size:1.6rem}}
.bandeau-sobre .grille-3 p,.bandeau-sobre p{color:#dbe7f5}.bandeau-sobre strong{color:#fff}

/* ---------- Avatar, icônes, pied de page, juridique ---------- */
.marque .avatar{border-radius:50%;box-shadow:0 0 0 2px #fff,0 0 0 3px var(--bleu)}
.hero-avatar{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}
.hero-avatar .avatar{flex:none;filter:drop-shadow(0 4px 10px rgba(26,74,128,.25))}
.hero-role{margin:0;color:var(--gris);font-size:.95rem}
.promesse .ico,.grille-3 .ico,.carte .ico{display:block;margin-bottom:.3rem}
.etape .ico{position:absolute;right:1rem;top:1rem;opacity:.9}
.final-avatar{display:flex;justify-content:center;align-items:center;gap:1rem;margin-bottom:.6rem}
.connexion-tete{display:flex;align-items:center;gap:1rem;margin-bottom:.8rem}
.pied{display:flex;flex-direction:column;gap:.4rem}
.pied-liens a{color:var(--bleu)}.pied-editeur{margin-left:1rem;color:var(--gris)}
.juridique{max-width:900px;margin:0 auto;line-height:1.6}
.juridique h2{font-size:1.05rem;margin-top:1.4rem}.juridique table{font-size:.88rem;margin:.5rem 0 1rem}.juridique th{width:32%}

/* ---------- Mobile ---------- */
@media(max-width:700px){
  .entete{grid-template-columns:1fr;gap:.4rem;padding:.6rem .9rem;position:static}
  .entete-gauche{justify-content:space-between}.accroche{display:none}
  .entete-centre{text-align:left}.entete-droite{justify-content:space-between;gap:.6rem;flex-wrap:wrap}
  .jauge{grid-template-columns:auto 80px auto}
  .page{grid-template-columns:1fr}
  .menu{flex-direction:row;overflow-x:auto;white-space:nowrap;padding:.3rem .4rem;gap:.2rem;border-right:0;border-bottom:1px solid var(--gris-clair);position:sticky;top:0;z-index:4}
  .menu a{padding:.5rem .7rem;border-left:0;border-bottom:3px solid transparent;font-size:.9rem}
  .menu a.actif{border-bottom-color:var(--bleu);background:transparent}
  .menu .retour{margin-top:0}
  .contenu{padding:1rem .9rem}
  .cartes{grid-template-columns:1fr 1fr}
  .hero{padding:1.2rem}.hero h1{font-size:1.45rem}.hero-avatar .avatar{width:72px;height:72px}
  .deux-colonnes,.grille-2,.grille-3,.etapes,.formules,.hero-promesses{grid-template-columns:1fr}
  .formule.mise-en-avant{transform:none}
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .doc{grid-template-columns:1fr;gap:.2rem}
  .filtres{flex-wrap:wrap}
  .bouton{width:100%;text-align:center;margin-bottom:.4rem}
  .connexion{margin:.5rem auto}
  .final{padding:1.2rem}
}
