/* ===== Couleurs et polices de MRC Communication ===== */
:root {
  --ardoise: #55727d;
  --ardoise-fonce: #3f5760;
  --ardoise-clair: #e3eaec;
  --creme: #f0eee5;
  --fond: #f0eee5;
  --creme-fonce: #e6e2d4;
  --caramel: #c8a47b;
  --caramel-clair: #f3e9dc;
  --blanc: #ffffff;
  --texte: #2f3e44;
  --texte-doux: #6f7f85;
  --ombre: 0 6px 24px rgba(85, 114, 125, 0.09);
  --rayon: 18px;
  --titre: 'Bebas Neue', sans-serif;
  --corps: 'Raleway', sans-serif;
  --petit: 'Open Sans', sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  background: var(--fond);
  color: var(--texte);
  font-family: var(--corps);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

/* ===== Mise en page générale ===== */
.app { display: flex; min-height: 100vh; }

.sidebar {
  width: 240px;
  flex-shrink: 0;
  background: var(--ardoise);
  color: var(--creme);
  display: flex;
  flex-direction: column;
  padding: 32px 18px 24px;
  position: sticky;
  top: 0;
  height: 100vh;
}
.brand { display: flex; flex-direction: column; padding: 0 12px 32px; }
.bouton-menu { display: none; }
.brand-mark { font-family: var(--titre); font-size: 2.6rem; letter-spacing: 3px; line-height: 1; }
.brand-sub { font-family: var(--corps); font-weight: 300; letter-spacing: 4px; text-transform: uppercase; font-size: .72rem; color: var(--caramel); margin-top: 4px; }

.nav { display: flex; flex-direction: column; gap: 4px; }
.nav a {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px;
  border-radius: 12px;
  color: var(--creme);
  text-decoration: none;
  font-weight: 500;
  font-size: .95rem;
  opacity: .82;
  transition: background .2s, opacity .2s;
}
.nav a:hover { background: rgba(240, 238, 229, .1); opacity: 1; }
.nav a.active { background: var(--creme); color: var(--ardoise-fonce); opacity: 1; }
.sidebar-foot { margin-top: auto; padding: 0 12px; font-size: .78rem; font-family: var(--petit); display: flex; flex-direction: column; gap: 10px; }
.sidebar-foot span { opacity: .6; }
.lien-sauvegarde { background: rgba(240, 238, 229, .12); color: var(--creme); border: none; border-radius: 10px; padding: 8px 12px; font-family: var(--corps); font-weight: 600; font-size: .8rem; cursor: pointer; }
.lien-sauvegarde:hover { background: rgba(240, 238, 229, .2); }
.etat-synchro { font-size: .7rem; opacity: .7; }
.etat-synchro[data-etat="erreur"] { color: #f4c7bb; opacity: 1; }
button.ns-retour { background: none; border: none; text-align: left; cursor: pointer; font-family: var(--corps); }
body.mode-connexion .sidebar { display: none; }
/* Démarrage : rien n'est montré tant qu'on ne sait pas qui est connecté (un client ou NStudio ne doit jamais apercevoir l'espace d'Éloïse) */
body.demarrage .app { visibility: hidden; }
body.demarrage::after { content: 'MRC'; position: fixed; inset: 0; display: grid; place-items: center; font-family: var(--titre); font-size: 3rem; letter-spacing: 4px; color: var(--ardoise); animation: respire 1.2s ease-in-out infinite alternate; }
@keyframes respire { from { opacity: .3; } to { opacity: 1; } }
.connexion { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 20px; }
.connexion-carte { background: var(--blanc); border-radius: 22px; padding: 36px 32px; width: min(420px, 100%); box-shadow: var(--ombre); }
.connexion-marque { padding: 0 0 18px; }
.connexion-marque .brand-mark { color: var(--ardoise); }
.connexion-carte h1 { font-family: var(--titre); font-weight: 400; font-size: 2.4rem; letter-spacing: 1px; color: var(--ardoise); margin: 0; }
.connexion-carte > .doux { margin: 4px 0 20px; font-size: .9rem; }
.champs-connexion { display: flex; flex-direction: column; gap: 12px; }
.champs-connexion input { font-family: var(--corps); font-size: 1rem; border: 1px solid var(--creme-fonce); border-radius: 12px; padding: 12px 14px; }
.champs-connexion input:focus { outline: 2px solid var(--caramel); outline-offset: -1px; }
.champs-connexion .btn { justify-content: center; padding: 13px; font-size: 1rem; margin-top: 6px; }
.mdp-zone { position: relative; display: block; }
.mdp-zone input { width: 100%; padding-right: 88px !important; }
.voir-mdp { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); border: none; background: var(--creme); color: var(--ardoise-fonce); font-family: var(--corps); font-weight: 700; font-size: .78rem; border-radius: 8px; padding: 7px 10px; cursor: pointer; }
.voir-mdp:hover { background: var(--creme-fonce); }
.erreur-connexion { color: #a35d4f; font-size: .86rem; margin: 0; min-height: 1em; }
.liste-comptes { display: flex; flex-direction: column; gap: 8px; margin: 12px 0 8px; }
.compte { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; background: var(--creme); border-radius: 12px; padding: 12px 14px; }
.compte > div:first-child { display: flex; flex-direction: column; gap: 2px; }
.compte .doux, .compte-id { font-size: .8rem; }
.compte-boutons { display: flex; gap: 6px; }
.mdp-nouveau { font-family: monospace; font-size: 1.2rem; background: var(--creme); padding: 4px 10px; border-radius: 8px; }
.boutons-sauvegarde { display: flex; gap: 10px; flex-wrap: wrap; margin: 16px 0 8px; }
.boutons-sauvegarde label { cursor: pointer; }
.rappel-sauvegarde { display: block; width: 100%; text-align: left; margin-bottom: 14px; padding: 10px 16px; border-radius: 12px; border: 1px dashed var(--creme-fonce); background: transparent; color: var(--texte-doux); font-family: var(--corps); font-size: .86rem; font-weight: 600; cursor: pointer; }
.rappel-sauvegarde:hover { background: var(--blanc); color: var(--ardoise-fonce); }
.lbl .court { display: none; }
.lien-ns { color: #04123f; background: #fec40b; text-decoration: none; font-weight: 700; border-radius: 10px; padding: 8px 12px; text-align: center; font-family: var(--corps); }
.lien-ns:hover { filter: brightness(1.05); }

.main { flex: 1; min-width: 0; }
.page { max-width: 1240px; margin: 0 auto; padding: 44px 40px 60px; animation: apparition .3s ease; }
.page.sans-animation { animation: none; }
.page.pleine-largeur { max-width: 1680px; }
@keyframes apparition { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* ===== En-tête de page ===== */
.entete { margin-bottom: 32px; }
.entete .surtitre { font-family: var(--petit); font-size: .8rem; letter-spacing: 2px; text-transform: uppercase; color: var(--caramel); font-weight: 600; }
.entete h1 { font-family: var(--titre); font-weight: 400; font-size: 3rem; letter-spacing: 1.5px; color: var(--ardoise); margin: 2px 0 4px; line-height: 1.05; }
.entete p { margin: 0; color: var(--texte-doux); }

/* ===== Cartes ===== */
.grille { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.carte {
  background: var(--blanc);
  border-radius: var(--rayon);
  padding: 24px;
  box-shadow: var(--ombre);
}
.carte h2 {
  font-family: var(--titre); font-weight: 400; letter-spacing: 1px;
  font-size: 1.6rem; color: var(--ardoise); margin: 0 0 14px;
  display: flex; align-items: center; gap: 10px;
}

/* ===== Page vide (en attendant) ===== */
.vide {
  text-align: center;
  padding: 56px 24px;
  border: 2px dashed var(--creme-fonce);
  border-radius: var(--rayon);
  background: rgba(255, 255, 255, .5);
}
.vide h3 { font-family: var(--titre); font-weight: 400; font-size: 1.7rem; letter-spacing: 1px; color: var(--ardoise); margin: 10px 0 6px; }
.vide p { color: var(--texte-doux); margin: 0 auto; max-width: 420px; }
.carte .vide { padding: 28px 16px; border-width: 1.5px; }
.carte .vide p { font-size: .92rem; }

/* ===== Boutons ===== */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  border: none; cursor: pointer;
  font-family: var(--corps); font-weight: 600; font-size: .92rem;
  padding: 11px 20px; border-radius: 999px;
  background: var(--ardoise); color: var(--creme);
  transition: background .2s, transform .1s;
}
.btn:hover { background: var(--ardoise-fonce); }
.btn:active { transform: scale(.97); }
.btn.doux { background: var(--caramel); color: var(--blanc); }
.btn.doux:hover { background: #b8925f; }

/* ===== Boutons (variantes) ===== */
.btn.secondaire { background: var(--blanc); color: var(--ardoise-fonce); box-shadow: inset 0 0 0 1px var(--creme-fonce); }
.btn.secondaire:hover { background: var(--creme); }
.btn.discret { background: transparent; color: var(--texte-doux); box-shadow: inset 0 0 0 1px var(--creme-fonce); }
.btn.discret:hover { color: var(--ardoise-fonce); background: var(--creme); }
.btn.petit { padding: 7px 13px; font-size: .82rem; }
.btn.mini { padding: 4px 10px; font-size: .78rem; }
.btn.lien-danger { background: transparent; color: #a35d4f; padding-left: 0; }
.btn.lien-danger:hover { background: transparent; text-decoration: underline; }
.lien { background: none; border: none; padding: 0; cursor: pointer; font: inherit; color: var(--ardoise); text-decoration: underline; text-underline-offset: 3px; }
.alerte { color: #a35d4f; }
.doux { color: var(--texte-doux); }

/* ===== En-tête avec bouton ===== */
.entete-action { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-end; justify-content: space-between; }
.vide-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 20px; }

/* ===== Prospection : le pipeline ===== */
.pipeline { display: flex; gap: 6px; margin-bottom: 14px; }
.seg {
  flex: 1 1 0; min-width: 0; min-height: 76px;
  display: flex; flex-direction: column; justify-content: space-between; text-align: left;
  border: 1px solid var(--creme-fonce); border-radius: 14px; padding: 12px 14px;
  background: var(--blanc); color: var(--texte); cursor: pointer;
  font-family: var(--corps); transition: flex-grow .35s ease, transform .1s;
}
.seg:hover { transform: translateY(-1px); }
.seg .n { font-family: var(--titre); font-size: 2rem; line-height: 1; letter-spacing: 1px; }
.seg .l { font-size: .78rem; color: var(--texte-doux); line-height: 1.2; font-weight: 500; }
.seg.choisi { outline: 2px solid var(--ardoise); outline-offset: -2px; }
.seg.st-1 { background: #f6efe6; }
.seg.st-2 { background: #efe2d0; }
.seg.st-3 { background: #dfe7e9; }
.seg.st-4 { background: #c9d6da; }
.seg.st-5 { background: var(--ardoise); color: var(--creme); border-color: var(--ardoise); }
.seg.st-5 .l { color: var(--creme); opacity: .85; }
.seg.st-6 { background: transparent; border-style: dashed; }

.resume { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; color: var(--texte-doux); font-size: .92rem; margin-bottom: 18px; }
.resume strong { color: var(--texte); }
.resume .alerte strong { color: inherit; }

/* ===== Prospection : les filtres ===== */
.filtres-barre { display: grid; grid-template-columns: minmax(200px, 2fr) repeat(3, minmax(130px, 1fr)) auto auto; gap: 8px; align-items: center; margin-bottom: 16px; }
.filtres-barre input[type=search], .filtres-barre select, .prospect select, .prospect input, .prospect textarea {
  width: 100%; font-family: var(--corps); font-size: .88rem; color: var(--texte);
  border: 1px solid var(--creme-fonce); background: var(--blanc); border-radius: 10px; padding: 8px 10px;
}
.filtres-barre input:focus, .filtres-barre select:focus, .prospect input:focus, .prospect select:focus, .prospect textarea:focus { outline: 2px solid var(--caramel); outline-offset: -1px; }
.case { display: flex; align-items: center; gap: 6px; font-size: .88rem; white-space: nowrap; cursor: pointer; }
.case input { accent-color: var(--ardoise); }

/* ===== Prospection : la liste ===== */
.liste-prospects { display: flex; flex-direction: column; gap: 8px; }
.prospect { background: var(--blanc); border-radius: 14px; border-left: 4px solid var(--creme-fonce); box-shadow: 0 2px 10px rgba(85, 114, 125, .06); }
.prospect.p-haute { border-left-color: var(--ardoise); }
.prospect.p-moyenne { border-left-color: var(--caramel); }
.prospect.p-basse { border-left-color: #e3cdb4; }
.prospect.gagne { background: #eef3f4; }
.prospect.perdu { opacity: .6; }
.prospect-ligne { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1.1fr) 160px auto; gap: 14px; align-items: center; padding: 12px 14px; }
.prospect-nom { all: unset; cursor: pointer; display: flex; flex-direction: column; min-width: 0; }
.prospect-nom b { font-weight: 700; font-size: 1rem; color: var(--ardoise-fonce); }
.prospect-nom:hover b { text-decoration: underline; text-underline-offset: 3px; }
.prospect-nom small { color: var(--texte-doux); font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.prospect-quand { font-size: .86rem; color: var(--texte-doux); display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.badge-retard { background: #b8725f; color: #fff; border-radius: 6px; padding: 1px 8px; font-size: .74rem; font-weight: 600; }
.prospect .statut-choix { font-weight: 600; }
.statut-choix.st-5 { background: var(--ardoise); color: var(--creme); }
.prospect-actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }

.relance-rapide { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 0 14px 12px; font-size: .84rem; }
.relance-rapide .etiquette { color: var(--texte-doux); white-space: nowrap; }
.relance-rapide.due .etiquette { color: #a35d4f; font-weight: 600; }
.prospect .relance-rapide input[type=date] { width: auto; padding: 5px 8px; font-size: .82rem; background: var(--creme); }
.boutons-jours { display: flex; gap: 4px; }
.prospect .relance-rapide .commentaire { flex: 1 1 220px; width: auto; border-color: transparent; background: transparent; }
.prospect .relance-rapide .commentaire:hover, .prospect .relance-rapide .commentaire:focus { border-color: var(--creme-fonce); background: var(--creme); }

.prospect-details { border-top: 1px solid var(--creme-fonce); padding: 18px; display: grid; grid-template-columns: 1.1fr 1fr 1.2fr; gap: 24px; }
.prospect-details h3 { font-family: var(--titre); font-weight: 400; letter-spacing: 1px; font-size: 1.3rem; color: var(--ardoise); margin: 0 0 10px; }
.prospect-details dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 5px 12px; font-size: .88rem; }
.prospect-details dt { color: var(--texte-doux); }
.prospect-details dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.prospect-details a { color: var(--ardoise); }
.analyse { margin: 14px 0 0; padding: 10px 12px; background: var(--caramel-clair); border-radius: 10px; font-size: .86rem; }
.prospect-details .champ { margin-bottom: 10px; }
.prospect-details textarea { resize: vertical; }
.deux-col { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.details-boutons { display: flex; gap: 8px; }

/* ===== Champs de formulaire ===== */
.champ { display: flex; flex-direction: column; gap: 4px; }
.champ > span { font-size: .78rem; color: var(--texte-doux); font-weight: 500; }

/* ===== Fenêtre (ajouter / modifier) ===== */
body.fige { overflow: hidden; }
.fenetre-fond { position: fixed; inset: 0; background: rgba(47, 62, 68, .45); display: flex; align-items: center; justify-content: center; padding: 16px; z-index: 50; animation: apparition .2s ease; }
.fenetre { background: var(--blanc); border-radius: 20px; width: min(680px, 100%); max-height: 90vh; display: flex; flex-direction: column; box-shadow: 0 20px 60px rgba(0, 0, 0, .2); }
.fenetre-tete { display: flex; align-items: center; justify-content: space-between; padding: 20px 24px 8px; }
.fenetre-tete h2 { font-family: var(--titre); font-weight: 400; letter-spacing: 1px; font-size: 1.9rem; color: var(--ardoise); margin: 0; }
.fermer { background: none; border: none; font-size: 1.8rem; line-height: 1; cursor: pointer; color: var(--texte-doux); }
.fenetre-corps { padding: 8px 24px 16px; overflow: auto; }
.champs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.champs .large { grid-column: 1 / -1; }
.champs input, .champs select, .champs textarea { font-family: var(--corps); font-size: .92rem; color: var(--texte); border: 1px solid var(--creme-fonce); border-radius: 10px; padding: 9px 11px; background: var(--blanc); width: 100%; }
.champs input:focus, .champs select:focus, .champs textarea:focus { outline: 2px solid var(--caramel); outline-offset: -1px; }
.champs .erreur { border-color: #b8725f; }
.fenetre-pied { display: flex; align-items: center; gap: 8px; padding: 14px 24px 20px; border-top: 1px solid var(--creme-fonce); }
.espace { flex: 1; }

/* ===== Petit message en bas ===== */
.toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); background: var(--ardoise-fonce); color: var(--creme); padding: 10px 18px; border-radius: 12px; font-size: .9rem; z-index: 60; box-shadow: 0 8px 24px rgba(0, 0, 0, .15); animation: apparition .2s ease; }

/* ===== To-do ===== */
.ajout-tache { display: flex; gap: 8px; margin-bottom: 28px; background: var(--blanc); padding: 8px; border-radius: 16px; box-shadow: var(--ombre); }
.ajout-tache input { font-family: var(--corps); font-size: .95rem; color: var(--texte); border: none; background: transparent; padding: 10px 12px; border-radius: 10px; }
.ajout-tache input[name=titre] { flex: 1; min-width: 0; }
.ajout-tache input[type=date] { background: var(--creme); color: var(--texte-doux); }
.ajout-tache input:focus { outline: 2px solid var(--caramel); outline-offset: -2px; }
.ajout-tache select { font-family: var(--corps); font-size: .9rem; color: var(--ardoise-fonce); font-weight: 600; border: none; background: var(--caramel-clair); border-radius: 10px; padding: 0 10px; }
.pastille-pour { font-size: .72rem; font-weight: 600; border-radius: 999px; padding: 2px 10px; white-space: nowrap; }
.pour-client { background: var(--ardoise-clair); color: var(--ardoise-fonce); }
.carres-todo { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; align-items: start; }
.carre-todo { padding: 22px; border-top: 5px solid var(--caramel); }
.carre-clients { border-top-color: var(--ardoise); }
.carre-tete { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.carre-tete h2 { margin: 0; }
.carre-tete p { margin: 0; font-size: .85rem; color: var(--texte-doux); }
.gros-compte { font-family: var(--titre); font-size: 2.4rem; line-height: 1; color: var(--caramel); }
.carre-clients .gros-compte { color: var(--ardoise); }
.carre-todo .ajout-tache { box-shadow: none; background: var(--creme); margin-bottom: 12px; padding: 6px; border-radius: 14px; flex-wrap: wrap; }
.carre-todo .ajout-tache input[type=date] { background: var(--blanc); }
.carre-todo .ajout-tache select { background: var(--blanc); padding: 8px 10px; }
.carre-todo .ajout-tache .btn { padding: 8px 16px; font-size: 1.1rem; }
.carre-todo .liste-taches { padding: 0; }
.carre-vide { color: var(--texte-doux); font-size: .9rem; text-align: center; padding: 18px 0 8px; margin: 0; }
.terminees { display: flex; align-items: center; gap: 12px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--creme); font-family: var(--corps); font-weight: 600; color: var(--texte-doux); font-size: .9rem; }
.groupe-taches { margin-bottom: 26px; }
.groupe-taches h2 { font-family: var(--titre); font-weight: 400; letter-spacing: 1px; font-size: 1.5rem; color: var(--ardoise); margin: 0 0 10px; display: flex; align-items: center; gap: 14px; }
.groupe-retard h2 { color: #a35d4f; }
.compte { font-family: var(--petit); font-size: .78rem; background: var(--caramel-clair); color: var(--caramel); border-radius: 999px; padding: 2px 9px; letter-spacing: 0; vertical-align: middle; }
.lien-titre { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; }
.fleche { font-size: 1rem; color: var(--texte-doux); }
.petit-lien { font-family: var(--corps); font-size: .82rem; letter-spacing: 0; color: var(--texte-doux); }
.liste-taches { padding: 6px 8px; }
.tache { display: flex; align-items: center; gap: 12px; padding: 10px 10px; border-radius: 10px; }
.tache + .tache { border-top: 1px solid var(--creme); }
.tache:hover { background: var(--creme); }
.coche { width: 24px; height: 24px; flex-shrink: 0; border-radius: 8px; border: 2px solid var(--ardoise); background: transparent; color: var(--creme); cursor: pointer; font-weight: 700; font-size: .85rem; display: flex; align-items: center; justify-content: center; transition: background .15s; }
.coche:hover { background: var(--ardoise-clair); }
.tache.faite .coche { background: var(--ardoise); }
.tache-titre { all: unset; cursor: pointer; flex: 1; min-width: 0; font-size: .95rem; overflow-wrap: anywhere; }
.tache.faite .tache-titre { text-decoration: line-through; color: var(--texte-doux); }
.tache-date { font-size: .8rem; color: var(--texte-doux); white-space: nowrap; font-family: var(--petit); }

/* ===== Clients : la liste ===== */
.grille-clients { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 22px; }
.carte-client { background: var(--blanc); border-radius: var(--rayon); overflow: hidden; box-shadow: var(--ombre); text-decoration: none; color: var(--texte); transition: transform .15s, box-shadow .15s; display: flex; flex-direction: column; }
.carte-client:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(85, 114, 125, .16); }
.carte-client-image { height: 150px; background: var(--ardoise) center / cover; position: relative; }
.carte-client-image::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(31, 42, 46, .55), rgba(31, 42, 46, .05)); }
.carte-client-logo { position: absolute; left: 18px; bottom: -28px; width: 72px; height: 72px; object-fit: contain; background: var(--blanc); border-radius: 18px; padding: 6px; box-shadow: 0 6px 18px rgba(0, 0, 0, .15); z-index: 1; }
.initiales { position: absolute; left: 18px; bottom: -28px; width: 72px; height: 72px; border-radius: 18px; background: var(--caramel); color: var(--blanc); font-family: var(--titre); font-size: 1.8rem; display: flex; align-items: center; justify-content: center; z-index: 1; letter-spacing: 1px; }
.carte-client-corps { padding: 40px 20px 18px; display: flex; flex-direction: column; gap: 10px; }
.carte-client-tete { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.carte-client-tete h2 { font-family: var(--titre); font-weight: 400; font-size: 1.6rem; letter-spacing: 1px; color: var(--ardoise); margin: 0; line-height: 1.1; }
.carte-client-projet { margin: 0; font-size: .9rem; color: var(--texte-doux); }
.jx { color: var(--caramel); font-weight: 700; }
.carte-client-pied { display: flex; justify-content: space-between; gap: 10px; font-size: .8rem; color: var(--texte-doux); font-family: var(--petit); }
.tag-statut { font-size: .74rem; font-weight: 600; border-radius: 999px; padding: 3px 10px; white-space: nowrap; background: var(--creme); color: var(--texte-doux); }
.tag-statut.statut-1 { background: var(--ardoise-clair); color: var(--ardoise-fonce); }
.tag-statut.statut-0 { background: var(--caramel-clair); color: #9a7448; }
.barre-avancement { height: 8px; background: var(--creme); border-radius: 999px; overflow: hidden; }
.barre-avancement span { display: block; height: 100%; background: linear-gradient(90deg, var(--caramel), var(--ardoise)); border-radius: 999px; transition: width .4s ease; }
.barre-avancement.grande { height: 12px; }

/* ===== Espace client : bannière ===== */
.retour { display: inline-block; color: var(--texte-doux); text-decoration: none; font-weight: 600; font-size: .9rem; margin-bottom: 14px; }
.retour:hover { color: var(--ardoise); }
.banniere-client { position: relative; border-radius: 22px; overflow: hidden; background: var(--ardoise) center 35% / cover; min-height: 250px; display: flex; align-items: flex-end; box-shadow: var(--ombre); }
.banniere-voile { position: absolute; inset: 0; background: linear-gradient(to top, rgba(25, 34, 38, .88) 0%, rgba(25, 34, 38, .35) 60%, rgba(25, 34, 38, .15) 100%); }
.banniere-contenu { position: relative; display: flex; align-items: flex-end; gap: 22px; padding: 28px; width: 100%; color: var(--creme); flex-wrap: wrap; }
.banniere-logo { width: 110px; height: 110px; object-fit: contain; background: var(--blanc); border-radius: 24px; padding: 8px; box-shadow: 0 8px 24px rgba(0, 0, 0, .25); }
.initiales.grand { position: static; width: 110px; height: 110px; font-size: 2.6rem; }
.banniere-contenu h1 { font-family: var(--titre); font-weight: 400; font-size: 3rem; letter-spacing: 1.5px; margin: 2px 0 2px; line-height: 1; }
.banniere-contenu p { margin: 0; opacity: .9; }
.surtitre.clair { color: var(--caramel); font-family: var(--petit); font-size: .78rem; letter-spacing: 2px; text-transform: uppercase; font-weight: 600; }
.compte-a-rebours { margin-left: auto; text-align: center; background: rgba(240, 238, 229, .14); backdrop-filter: blur(6px); border: 1px solid rgba(240, 238, 229, .25); border-radius: 18px; padding: 12px 20px; }
.compte-a-rebours .n { display: block; font-family: var(--titre); font-size: 2.6rem; line-height: 1; letter-spacing: 1px; color: var(--caramel); }
.compte-a-rebours .l { font-size: .78rem; opacity: .85; }

.onglets-client { display: flex; gap: 4px; margin: 22px 0; border-bottom: 1px solid var(--creme-fonce); overflow-x: auto; }
.onglets-client button { font-family: var(--corps); font-weight: 600; font-size: .95rem; background: none; border: none; padding: 12px 16px; color: var(--texte-doux); cursor: pointer; border-bottom: 3px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.onglets-client button:hover { color: var(--ardoise-fonce); }
.onglets-client button.choisi { color: var(--ardoise-fonce); border-bottom-color: var(--caramel); }
.onglet-lien { font-family: var(--corps); font-weight: 600; font-size: .95rem; padding: 12px 16px; color: var(--texte-doux); text-decoration: none; border-bottom: 3px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.onglet-lien:hover { color: var(--ardoise-fonce); }
.onglet-lien.choisi { color: var(--ardoise-fonce); border-bottom-color: var(--caramel); }

/* ===== Espace client : vue d'ensemble ===== */
.grille-client { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; align-items: start; }
.infos-liste { margin: 0 0 18px; display: grid; grid-template-columns: auto 1fr; gap: 7px 14px; font-size: .9rem; }
.infos-liste dt { color: var(--texte-doux); }
.infos-liste dd { margin: 0; overflow-wrap: anywhere; }
.infos-liste a { color: var(--ardoise); }
.avancement-bloc { background: var(--creme); border-radius: 14px; padding: 14px; margin-bottom: 14px; display: flex; flex-direction: column; gap: 8px; }
.avancement-tete { display: flex; justify-content: space-between; font-weight: 600; font-size: .9rem; }
.avancement-tete strong { font-family: var(--titre); font-weight: 400; font-size: 1.5rem; color: var(--ardoise); line-height: 1; }
.avancement-bloc input[type=range] { accent-color: var(--ardoise); width: 100%; }
.avancement-bloc small { font-size: .76rem; }
.supprimer-mini { background: none; border: none; color: var(--texte-doux); font-size: 1.2rem; cursor: pointer; opacity: 0; transition: opacity .15s; padding: 0 4px; }
.tache:hover .supprimer-mini, li:hover .supprimer-mini { opacity: 1; }
.ajout-compact { box-shadow: none; background: var(--creme); margin: 12px 0 0; padding: 5px; flex-wrap: wrap; }
.ajout-compact input { padding: 8px 10px; }
.ajout-compact input[type=date] { background: var(--blanc); }
.ajout-compact .btn { padding: 7px 14px; }
.mini-posts { display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; }
.mini-post { all: unset; cursor: pointer; display: grid; grid-template-columns: 64px 1fr; grid-template-rows: auto auto; gap: 2px 10px; padding: 10px; border-radius: 12px; background: var(--creme); }
.mini-post:hover { background: var(--creme-fonce); }
.mini-date { grid-row: span 2; font-family: var(--titre); font-size: 1.2rem; color: var(--caramel); align-self: center; letter-spacing: .5px; }
.mini-titre { font-weight: 600; font-size: .88rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mini-post .etat { justify-self: start; }
.puces { margin: 0; padding-left: 18px; }
.puces li { margin-bottom: 6px; }
.petit-titre { font-family: var(--titre); font-weight: 400; font-size: 1.2rem; letter-spacing: 1px; color: var(--ardoise); margin: 18px 0 10px; }
.nuancier { display: flex; gap: 12px; flex-wrap: wrap; }
.nuance { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.nuance span { width: 52px; height: 52px; border-radius: 14px; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08); }
.nuance code { font-size: .72rem; color: var(--texte-doux); }
.zone-notes, .fiche textarea { width: 100%; font-family: var(--corps); font-size: .9rem; color: var(--texte); border: 1px solid var(--creme-fonce); border-radius: 12px; padding: 12px; background: var(--creme); resize: vertical; line-height: 1.55; }
.zone-notes:focus, .fiche textarea:focus { outline: 2px solid var(--caramel); outline-offset: -1px; background: var(--blanc); }

/* ===== États des contenus ===== */
.etat { font-size: .72rem; font-weight: 600; border-radius: 999px; padding: 3px 10px; white-space: nowrap; background: var(--creme); color: var(--texte-doux); }
.etat-1 { background: #f3ead2; color: #8a6d2c; }
.etat-2, .etat-3 { background: var(--caramel-clair); color: #9a7448; }
.etat-4 { background: #ebe1ef; color: #6d4f7c; }
.etat-5 { background: #f4dfda; color: #a35d4f; }
.etat-6 { background: var(--ardoise-clair); color: var(--ardoise-fonce); }
.etat-7 { background: #dfeadf; color: #4c7351; }

/* ===== Espace client : calendrier ===== */
.barre-calendrier { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; align-items: center; margin-bottom: 16px; }
.filtres-calendrier { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.filtre { font-family: var(--corps); font-weight: 600; font-size: .86rem; border: 1px solid var(--creme-fonce); background: transparent; color: var(--texte-doux); padding: 7px 14px; border-radius: 999px; cursor: pointer; }
.filtre:hover { background: var(--blanc); color: var(--ardoise-fonce); }
.filtre.choisi { background: var(--ardoise); border-color: var(--ardoise); color: var(--creme); }
.filtres-calendrier select { font-family: var(--corps); font-size: .86rem; border: 1px solid var(--creme-fonce); background: var(--blanc); border-radius: 999px; padding: 7px 12px; color: var(--texte); }
.chiffres-calendrier { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-bottom: 26px; }
.chiffres-calendrier div { background: var(--blanc); border-radius: 14px; padding: 14px 16px; box-shadow: 0 2px 10px rgba(85, 114, 125, .06); display: flex; flex-direction: column; }
.chiffres-calendrier .n { font-family: var(--titre); font-size: 1.9rem; color: var(--ardoise); line-height: 1.1; letter-spacing: .5px; }
.chiffres-calendrier .l { font-size: .78rem; color: var(--texte-doux); }
.mois { margin-bottom: 24px; }
.mois h2 { font-family: var(--titre); font-weight: 400; font-size: 1.6rem; letter-spacing: 1px; color: var(--ardoise); margin: 0 0 10px; text-transform: capitalize; display: flex; align-items: center; gap: 12px; }
.liste-posts { padding: 6px; }
.post { all: unset; box-sizing: border-box; width: 100%; cursor: pointer; display: grid; grid-template-columns: 70px minmax(0, 1fr) 120px 90px 150px; gap: 12px; align-items: center; padding: 11px 12px; border-radius: 10px; }
.post + .post { border-top: 1px solid var(--creme); }
.post:hover { background: var(--creme); }
.post.aujourdhui { background: var(--caramel-clair); }
.post-date { font-family: var(--petit); font-size: .82rem; color: var(--texte-doux); text-transform: capitalize; }
.post-titre { font-weight: 600; font-size: .92rem; display: flex; flex-direction: column; min-width: 0; }
.post-titre small { font-weight: 400; color: var(--texte-doux); font-size: .76rem; }
.post-format { font-size: .82rem; color: var(--texte-doux); }
.post-stats { font-size: .8rem; color: var(--ardoise); font-family: var(--petit); }
.post .etat { justify-self: end; }
.lien-notion { margin: 14px 0 0; font-size: .86rem; }
.lien-notion a { color: var(--ardoise); }

/* ===== Calendrier mensuel ===== */
.bascule { display: inline-flex; background: var(--blanc); border-radius: 999px; padding: 3px; box-shadow: inset 0 0 0 1px var(--creme-fonce); }
.bascule button { font-family: var(--corps); font-weight: 600; font-size: .86rem; border: none; background: transparent; color: var(--texte-doux); padding: 6px 14px; border-radius: 999px; cursor: pointer; }
.bascule button.choisi { background: var(--ardoise); color: var(--creme); }
.nav-mois { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.nav-mois h2 { font-family: var(--titre); font-weight: 400; font-size: 2rem; letter-spacing: 1px; color: var(--ardoise); margin: 0 6px; text-transform: capitalize; display: flex; align-items: center; gap: 10px; min-width: 230px; }
.legendes { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.legende { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.legende .etat { font-size: .68rem; }
.legende-titre { font-family: var(--petit); font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--texte-doux); width: 52px; }
.pastille-format { font-size: .68rem; font-weight: 700; border-radius: 6px; padding: 3px 9px; border-left: 3px solid; }

.grille-mois { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); padding: 0; overflow: hidden; }
.nom-jour { font-family: var(--petit); font-size: .74rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--texte-doux); padding: 10px 8px; background: var(--creme); text-align: center; }
.case-jour { min-height: 170px; border-top: 1px solid var(--creme); border-right: 1px solid var(--creme); padding: 6px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.case-jour:nth-child(7n) { border-right: none; }
.case-jour.hors-mois { background: rgba(240, 238, 229, .45); }
.case-jour.hors-mois .num-jour { opacity: .45; }
.case-tete { display: flex; justify-content: space-between; align-items: center; }
.num-jour { font-family: var(--petit); font-size: .82rem; font-weight: 600; color: var(--texte-doux); width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; border-radius: 50%; }
.case-jour.aujourdhui .num-jour { background: var(--caramel); color: var(--blanc); }
.ajout-jour { border: none; background: none; color: var(--texte-doux); font-size: 1.1rem; cursor: pointer; opacity: 0; border-radius: 6px; width: 24px; height: 24px; line-height: 1; }
.case-jour:hover .ajout-jour { opacity: 1; }
.ajout-jour:hover { background: var(--creme); color: var(--ardoise); }
.puce-post { all: unset; box-sizing: border-box; cursor: pointer; display: flex; flex-direction: column; gap: 3px; width: 100%; padding: 7px 9px; border-radius: 9px; border-left: 4px solid; transition: filter .15s, transform .1s; }
.puce-post:hover { filter: brightness(.95); transform: translateY(-1px); }
.puce-haut { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.puce-format { font-weight: 700; font-size: .64rem; text-transform: uppercase; letter-spacing: .4px; opacity: .75; }
.puce-ev { font-size: .64rem; opacity: .6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.puce-titre { font-size: .8rem; font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.puce-etat.etat { font-size: .62rem; padding: 2px 8px; align-self: flex-start; margin-top: 2px; box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .8); }
.puce-etat.etat-0 { background: #fff; }


/* ===== Fiche détaillée d'un contenu ===== */
.panneau { width: min(760px, 100%); }
.detail-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tag-gris { font-size: .72rem; font-weight: 600; border-radius: 999px; padding: 3px 10px; background: var(--creme); color: var(--texte-doux); }
.detail-date { margin: 12px 0 16px; font-weight: 600; color: var(--ardoise); text-transform: capitalize; }
.detail-chiffres { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; margin-bottom: 18px; }
.detail-chiffres div { background: var(--creme); border-radius: 12px; padding: 10px 12px; display: flex; flex-direction: column; }
.detail-chiffres .n { font-family: var(--titre); font-size: 1.5rem; color: var(--ardoise); line-height: 1.1; }
.detail-chiffres .l { font-size: .72rem; color: var(--texte-doux); }
.detail-post h3 { font-family: var(--titre); font-weight: 400; font-size: 1.3rem; letter-spacing: 1px; color: var(--ardoise); margin: 0 0 8px; }
.brief-titre { color: var(--ardoise-fonce); }
.detail-brief { white-space: pre-wrap; background: var(--creme); border-radius: 12px; padding: 14px 16px; font-size: .9rem; line-height: 1.6; }
.detail-caption { background: var(--blanc); border: 1.5px solid var(--caramel); }
.carre-tete.titre-brief { align-items: center; margin-bottom: 8px; }
.carre-tete.titre-brief h3 { margin: 0; }

/* ===== Argent (tableau de bord + Finances) ===== */
.tuiles-argent { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 22px; }
.tuile-argent { background: var(--blanc); border-radius: 16px; padding: 16px 18px; box-shadow: 0 2px 10px rgba(85, 114, 125, .06); display: flex; flex-direction: column; gap: 2px; text-decoration: none; color: var(--texte); border-top: 4px solid var(--creme-fonce); }
.tuile-argent .l { font-size: .8rem; color: var(--texte-doux); font-weight: 600; }
.tuile-argent .n { font-family: var(--titre); font-size: 2rem; letter-spacing: .5px; color: var(--ardoise); line-height: 1.1; }
.tuile-argent .s { font-size: .78rem; color: var(--texte-doux); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tuile-argent.ok { border-top-color: #6f9a72; }
.tuile-argent.ok .n { color: #4c7351; }
.tuile-argent.retard { border-top-color: #b8725f; background: #fbf1ee; }
.tuile-argent.retard .n, .tuile-argent.retard .s { color: #a35d4f; }
a.tuile-argent:hover { transform: translateY(-2px); transition: transform .15s; }

.table-docs { padding: 6px; overflow-x: auto; }
.doc { display: grid; grid-template-columns: 1fr auto; align-items: center; border-radius: 10px; }
.doc + .doc { border-top: 1px solid var(--creme); }
.doc:hover:not(.doc-tete) { background: var(--creme); }
.doc-ouvrir, .doc-tete { all: unset; box-sizing: border-box; cursor: pointer; display: grid; grid-template-columns: 110px 1.3fr 1.6fr 100px 90px 100px 130px; gap: 12px; align-items: center; padding: 11px 12px; font-size: .88rem; min-width: 0; }
.doc-tete { cursor: default; grid-column: 1 / -1; grid-template-columns: 110px 1.3fr 1.6fr 100px 90px 100px 130px 120px; font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; color: var(--texte-doux); font-family: var(--petit); }
.doc-num { display: flex; flex-direction: column; font-weight: 700; color: var(--ardoise-fonce); }
.doc-num small { font-weight: 600; font-size: .68rem; color: var(--texte-doux); text-transform: uppercase; letter-spacing: .5px; }
.doc-client { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc-objet { color: var(--texte-doux); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc-montant { font-weight: 700; }
.doc-action { padding-right: 10px; width: 120px; display: flex; justify-content: flex-end; }
.statut-fin { font-size: .72rem; font-weight: 700; border-radius: 999px; padding: 3px 10px; white-space: nowrap; }
.fin-ok { background: #dfeadf; color: #4c7351; }
.fin-retard { background: #f4dfda; color: #a35d4f; }
.fin-partiel { background: var(--caramel-clair); color: #9a7448; }
.fin-attente { background: var(--ardoise-clair); color: var(--ardoise-fonce); }
.fin-neutre { background: var(--creme); color: var(--texte-doux); }

/* ===== Paiements mensuels ===== */
.titre-section { font-family: var(--titre); font-weight: 400; font-size: 1.6rem; letter-spacing: 1px; color: var(--ardoise); margin: 0 0 12px; }
.titre-section .doux { font-family: var(--corps); font-size: .9rem; letter-spacing: 0; text-transform: capitalize; }
.bloc-mensuels { margin-bottom: 28px; }
.grille-mensuels { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.mensuel { padding: 16px; display: flex; flex-direction: column; gap: 12px; border-left: 4px solid #6f9a72; }
.mensuel.en-retard { border-left-color: #b8725f; background: #fbf1ee; }
.mensuel-ouvrir { all: unset; cursor: pointer; display: flex; flex-direction: column; gap: 2px; }
.mensuel-client { font-weight: 700; color: var(--ardoise-fonce); }
.mensuel-montant { font-family: var(--titre); font-size: 1.8rem; color: var(--ardoise); letter-spacing: .5px; line-height: 1.1; }
.mensuel-montant small { font-family: var(--corps); font-size: .8rem; color: var(--texte-doux); letter-spacing: 0; }
.mensuel-ouvrir .doux { font-size: .8rem; }
.mensuel-pied { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.mensuel-partiel { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: .82rem; background: var(--caramel-clair); color: #7a5b38; border-radius: 10px; padding: 8px 10px; }
.mensuel-historique { display: flex; gap: 6px; flex-wrap: wrap; font-size: .72rem; color: #4c7351; }
.mensuel-historique span { background: #eef4ee; border-radius: 999px; padding: 2px 8px; }
.alerte-retard { display: block; margin-bottom: 18px; padding: 12px 16px; border-radius: 12px; background: #fbf1ee; color: #a35d4f; font-weight: 600; font-size: .9rem; text-decoration: none; border-left: 4px solid #b8725f; }
.alerte-retard:hover { background: #f7e6e1; }

/* ===== Tableau de bord ===== */
.bloc-objectifs { margin-bottom: 18px; }
.grille-objectifs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.objectif { background: var(--creme); border-radius: 14px; padding: 16px; display: flex; flex-direction: column; gap: 6px; }
.objectif-tete { display: flex; justify-content: space-between; align-items: baseline; }
.objectif-titre { font-weight: 700; font-size: .9rem; }
.objectif-pct { font-family: var(--titre); font-size: 1.8rem; color: var(--caramel); line-height: 1; }
.objectif-valeurs { font-size: .95rem; }
.objectif-valeurs strong { font-size: 1.15rem; color: var(--ardoise-fonce); }
.objectif small { font-size: .74rem; }
.barre-avancement.atteint span { background: linear-gradient(90deg, #8bb08e, #4c7351); }
.grille-tableau { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; margin-bottom: 18px; align-items: start; }
.gros-compte.alerte { color: #a35d4f; }
.liste-mini { display: flex; flex-direction: column; }
.mini-ligne { display: flex; justify-content: space-between; gap: 10px; padding: 9px 8px; border-radius: 10px; text-decoration: none; color: var(--texte); }
.mini-ligne + .mini-ligne { border-top: 1px solid var(--creme); }
.mini-ligne:hover { background: var(--creme); }
.mini-info { font-size: .8rem; color: var(--texte-doux); white-space: nowrap; }
.pied-bloc { margin: 12px 0 0; font-size: .86rem; }
.pied-bloc a { color: var(--ardoise); font-weight: 600; text-decoration: none; }
.pied-bloc a:hover { text-decoration: underline; }
.mini-client { display: flex; gap: 12px; align-items: center; padding: 10px 8px; border-radius: 12px; text-decoration: none; color: var(--texte); }
.mini-client:hover { background: var(--creme); }
.mini-client img { width: 46px; height: 46px; object-fit: contain; border-radius: 12px; background: var(--creme); padding: 3px; }
.initiales.petit { position: static; width: 46px; height: 46px; font-size: 1.1rem; border-radius: 12px; flex-shrink: 0; }
.mini-client-corps { flex: 1; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.mini-post.fmt-reel, .mini-post.fmt-carrousel, .mini-post.fmt-post, .mini-post.fmt-story, .mini-post.fmt-email, .mini-post.fmt-video, .mini-post.fmt-linkedin, .mini-post.fmt-instagram { border-left: 4px solid; }
.liens-rapides { display: flex; flex-wrap: wrap; gap: 8px; }
.lien-rapide { background: var(--creme); color: var(--ardoise-fonce); text-decoration: none; font-weight: 600; font-size: .88rem; padding: 10px 16px; border-radius: 999px; transition: background .15s; }
.lien-rapide:hover { background: var(--caramel-clair); }
.lien-rapide span { color: var(--caramel); }

/* ===== Page Contenu ===== */
.detail-strategie { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; font-size: .86rem; margin: 12px 0 0; background: var(--creme); border-radius: 12px; padding: 10px 14px; }
.detail-strategie dt { color: var(--texte-doux); }
.detail-strategie dd { margin: 0; font-weight: 600; }
.banque-idees { margin-top: 34px; }
.banque-idees h2 { font-family: var(--titre); font-weight: 400; font-size: 1.8rem; letter-spacing: 1px; color: var(--ardoise); margin: 0; }
.banque-idees .doux { margin: 0; font-size: .88rem; }
.grille-idees { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; margin-top: 14px; }
.idee { all: unset; box-sizing: border-box; cursor: pointer; display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; border-radius: 12px; border-left: 4px solid; min-height: 80px; transition: transform .1s; }
.idee:hover { transform: translateY(-2px); }
.idee-titre { font-weight: 600; font-size: .88rem; line-height: 1.35; }
/* Couleurs par type de contenu : fond doux + liseré plus foncé */
.fmt-reel { background: #f4ddd5; border-left-color: #c47a63 !important; color: #6e3b2c; }
.fmt-carrousel { background: #dce7ea; border-left-color: #55727d !important; color: #2f4a52; }
.fmt-post { background: #f2e7d6; border-left-color: #c8a47b !important; color: #6b5233; }
.fmt-story { background: #e8e1f0; border-left-color: #8a74a8 !important; color: #4d3d66; }
.fmt-email { background: #e0ebdf; border-left-color: #6f9a72 !important; color: #34523a; }
.fmt-video { background: #f5dcdc; border-left-color: #b55a5a !important; color: #6a2c2c; }
.fmt-instagram { background: #ece3f5; border-left-color: #7b5ea7 !important; color: #4a356b; }
.fmt-linkedin { background: #dbe8f6; border-left-color: #0a66c2 !important; color: #0b3d73; }
.fmt-autre { background: var(--creme); border-left-color: var(--creme-fonce) !important; color: var(--texte); }

/* ===== Espace client : infos & contacts ===== */
.infos-grille { display: grid; grid-template-columns: 1fr 2fr; gap: 22px; align-items: start; }
.liste-liens { list-style: none; margin: 0; padding: 0; }
.liste-liens li { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--creme); }
.liste-liens a { color: var(--ardoise-fonce); font-weight: 600; font-size: .9rem; text-decoration: none; }
.liste-liens a:hover { text-decoration: underline; }
.ajout-lien input { flex: 1 1 120px; min-width: 0; }
.fiches { display: flex; flex-direction: column; gap: 14px; }
.fiche summary { cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; }
.fiche summary::-webkit-details-marker { display: none; }
.fiche summary::after { content: '▾'; color: var(--texte-doux); }
.fiche[open] summary::after { content: '▴'; }
.fiche summary h2 { margin: 0; }
.fiche textarea { margin-top: 14px; }
.table-contacts { display: flex; flex-direction: column; }
.contact { all: unset; cursor: pointer; display: grid; grid-template-columns: 1.2fr 1.4fr 1.4fr 1fr; gap: 12px; padding: 12px 10px; border-radius: 10px; font-size: .88rem; }
.contact + .contact { border-top: 1px solid var(--creme); }
.contact:hover { background: var(--creme); }
.contact span { overflow-wrap: anywhere; }

@media (max-width: 1100px) {
  .grille-offres { grid-template-columns: 1fr; }
  .chiffres-cles { grid-template-columns: repeat(2, 1fr); }
  .tuiles-argent { grid-template-columns: repeat(2, 1fr); }
  .grille-objectifs { grid-template-columns: 1fr; }
  .grille-client { grid-template-columns: 1fr 1fr; }
  .infos-grille { grid-template-columns: 1fr; }
  .chiffres-calendrier { grid-template-columns: repeat(3, 1fr); }
  .post { grid-template-columns: 60px minmax(0, 1fr) 140px; }
  .post-format, .post-stats { display: none; }
  .filtres-barre { grid-template-columns: 1fr 1fr; }
  .filtres-barre .recherche { grid-column: 1 / -1; }
  .prospect-ligne { grid-template-columns: 1fr 160px; }
  .prospect-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .prospect-quand { grid-row: 2; }
  .prospect-details { grid-template-columns: 1fr; }
}

/* ===== Bloc montage dans la fiche d'un contenu ===== */
.puce-ns { font-size: .58rem; font-weight: 800; background: #04123f; color: #fec40b; border-radius: 4px; padding: 1px 5px; letter-spacing: .5px; }
.bloc-montage { margin: 18px 0; border: 1.5px solid #04123f22; border-radius: 14px; padding: 14px; background: #f3f3f3; }
.montage-tete { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.case-nstudio { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; font-size: .9rem; color: #04123f; }
.case-nstudio input { width: 18px; height: 18px; accent-color: #04123f; margin-top: 2px; }
.case-nstudio small { color: var(--texte-doux); font-weight: 400; }
.bloc-montage select, .ajout-commentaire select, .ajout-commentaire input { font-family: var(--corps); font-size: .86rem; border: 1px solid #d9d9d9; border-radius: 10px; padding: 7px 10px; background: #fff; color: var(--texte); }
.montage-statut { margin: 12px 0 8px; font-size: .88rem; }
.bloc-montage h4 { margin: 14px 0 8px; font-size: .9rem; color: #04123f; }
.statut-montage { font-size: .74rem; font-weight: 700; border-radius: 999px; padding: 3px 10px; }
.vue-client { background: #fff; border-radius: 12px; padding: 12px; margin-top: 10px; display: flex; flex-direction: column; gap: 10px; }
.vue-client-titre { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: var(--texte-doux); font-family: var(--petit); }
.boutons-client { display: flex; gap: 8px; flex-wrap: wrap; }
.ajout-commentaire { display: flex; gap: 6px; margin-top: 10px; flex-wrap: wrap; }
.ajout-commentaire input { flex: 1 1 180px; }
.titre-brief { margin-top: 18px !important; }
.petit-texte { font-size: .84rem; margin: 6px 0; }
.video-cadre { width: 100%; aspect-ratio: 9 / 16; max-height: 480px; border: none; border-radius: 12px; background: #000; display: block; }
.bouton-video { background: #04123f; color: #fec40b; align-self: flex-start; text-decoration: none; }
.bouton-video:hover { background: #0b1f5c; }
.fil { display: flex; flex-direction: column; gap: 8px; }
.bulle { border-radius: 12px; padding: 8px 12px; max-width: 90%; display: flex; flex-direction: column; gap: 2px; font-size: .86rem; }
.bulle-auteur { font-size: .7rem; font-weight: 700; opacity: .7; }
.bulle-monteur { background: #04123f; color: #f3f3f3; align-self: flex-start; }
.bulle-eloise { background: var(--caramel-clair); color: #5d4528; align-self: flex-end; }
.bulle-client { background: #fff; border: 1px solid #e3e3e3; align-self: flex-start; }

/* Couleurs des statuts de montage (identité NStudio) */
.mt-0 { --mt: #8a93a8; --mt-fond: #eceef2; }
.mt-1 { --mt: #2b59c3; --mt-fond: #e3eafb; }
.mt-2 { --mt: #b8890a; --mt-fond: #fff3cc; }
.mt-3 { --mt: #c2410c; --mt-fond: #fde4d6; }
.mt-4 { --mt: #2f7a46; --mt-fond: #dff1e4; }
.statut-montage, .ns-statut { background: var(--mt-fond); color: var(--mt); }

/* ===== Espace NStudio (le monteur) : #04123f · #fec40b · #f3f3f3 ===== */
body.mode-monteur { background: #f3f3f3; }
body.mode-monteur .sidebar { display: none; }
body.mode-monteur .page { max-width: none; padding: 0; animation: none; }
.ns-app { display: grid; grid-template-columns: 250px 1fr; min-height: 100vh; }
.ns-menu { background: #04123f; color: #f3f3f3; padding: 28px 16px 22px; display: flex; flex-direction: column; gap: 26px; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.ns-marque { padding: 0 10px; }
.ns-nav { display: flex; flex-direction: column; gap: 4px; }
.ns-nav a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; color: #f3f3f3; text-decoration: none; font-weight: 600; font-size: .92rem; opacity: .85; }
.ns-nav a:hover { background: rgba(243, 243, 243, .08); opacity: 1; }
.ns-nav a.actif { background: #fec40b; color: #04123f; opacity: 1; }
.ns-nav a img, .ns-mini-init { width: 28px; height: 28px; border-radius: 8px; object-fit: contain; background: #f3f3f3; flex-shrink: 0; }
.ns-mini-init { display: flex; align-items: center; justify-content: center; font-size: .7rem; font-weight: 800; color: #04123f; }
.ns-nav-nom { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ns-nav-titre { font-size: .68rem; text-transform: uppercase; letter-spacing: 2px; opacity: .5; padding: 14px 12px 4px; font-family: var(--petit); }
.ns-nav-vide { font-size: .8rem; opacity: .5; padding: 0 12px; }
.ns-badge { margin-left: auto; background: rgba(254, 196, 11, .2); color: #fec40b; font-size: .72rem; font-weight: 800; border-radius: 999px; padding: 2px 8px; font-family: var(--corps); letter-spacing: 0; vertical-align: middle; }
.ns-nav a.actif .ns-badge { background: #04123f; color: #fec40b; }
.ns-retour { margin-top: auto; display: flex; flex-direction: column; gap: 2px; color: #f3f3f3; font-size: .82rem; text-decoration: none; padding: 0 10px; opacity: .8; }
.ns-retour small { opacity: .6; font-size: .7rem; }
.ns-retour:hover { color: #fec40b; opacity: 1; }
.ns-contenu { padding: 36px 40px 60px; min-width: 0; }
.ns-entete { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.ns-entete-logo { width: 64px; height: 64px; border-radius: 16px; object-fit: contain; background: #fff; padding: 5px; box-shadow: 0 4px 14px rgba(4, 18, 63, .1); }
.ns-sur { font-size: .76rem; text-transform: uppercase; letter-spacing: 2px; color: #b8890a; font-weight: 700; font-family: var(--petit); }
.ns-logo { font-family: var(--titre); font-size: 2.2rem; color: #fec40b; letter-spacing: 2px; line-height: 1; }
.ns-logo span { color: #f3f3f3; }
.ns-marque { display: flex; flex-direction: column; }
.ns-sous { color: #f3f3f3; opacity: .7; font-size: .74rem; letter-spacing: 3px; text-transform: uppercase; font-family: var(--petit); }
.ns-titre { font-family: var(--titre); font-weight: 400; font-size: 2.8rem; letter-spacing: 1.5px; color: #04123f; margin: 0; line-height: 1.05; }
.ns-compteurs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-bottom: 18px; }
.ns-compteur { all: unset; box-sizing: border-box; cursor: pointer; background: #fff; border-radius: 14px; padding: 14px 16px; display: flex; flex-direction: column; border-bottom: 4px solid var(--mt); transition: transform .1s; }
.ns-compteur:hover { transform: translateY(-2px); }
.ns-compteur.choisi { outline: 2px solid #04123f; }
.ns-compteur .n { font-family: var(--titre); font-size: 2.2rem; color: #04123f; line-height: 1; }
.ns-compteur .l { font-size: .78rem; color: #5b6478; font-weight: 600; }
.ns-barre { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.ns-bascule { display: inline-flex; background: #fff; border-radius: 999px; padding: 3px; }
.ns-bascule button { font-family: var(--corps); font-weight: 700; font-size: .86rem; border: none; background: transparent; color: #04123f; padding: 7px 16px; border-radius: 999px; cursor: pointer; }
.ns-bascule button.choisi { background: #04123f; color: #fec40b; }
.ns-liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; }
.ns-carte { background: #fff; border-radius: 16px; padding: 16px; display: flex; flex-direction: column; gap: 14px; border-left: 5px solid var(--mt); box-shadow: 0 4px 16px rgba(4, 18, 63, .06); }
.ns-carte-tete { display: flex; gap: 12px; align-items: flex-start; }
.ns-logo-client { width: 44px; height: 44px; border-radius: 12px; object-fit: contain; background: #f3f3f3; padding: 3px; flex-shrink: 0; }
.ns-initiales { display: flex; align-items: center; justify-content: center; background: #04123f; color: #fec40b; font-family: var(--titre); font-size: 1.1rem; padding: 0; }
.ns-carte-titre { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ns-client { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .8px; color: #5b6478; }
.ns-carte-titre b { color: #04123f; font-size: .98rem; line-height: 1.3; }
.ns-infos { font-size: .8rem; color: #5b6478; margin: 0; }
.ns-alerte { color: #c2410c; font-weight: 700; }
.ns-prio { font-size: .7rem; font-weight: 800; border-radius: 999px; padding: 4px 10px; white-space: nowrap; }
.mp-0 { background: #fec40b; color: #04123f; }
.mp-1 { background: #e6e9f2; color: #04123f; }
.mp-2 { background: #f3f3f3; color: #8a93a8; }
.ns-carte-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.ns-statut { font-family: var(--corps); font-weight: 700; font-size: .86rem; border: none; border-radius: 10px; padding: 8px 12px; cursor: pointer; }
.ns-btn { font-family: var(--corps); font-weight: 700; font-size: .84rem; border: none; border-radius: 10px; padding: 8px 14px; cursor: pointer; background: #04123f; color: #f3f3f3; }
.ns-btn:hover { background: #0b1f5c; }
.ns-btn.jaune { background: #fec40b; color: #04123f; }
.ns-btn.jaune:hover { filter: brightness(1.05); }
.ns-vide { text-align: center; padding: 50px 20px; background: #fff; border-radius: 16px; color: #5b6478; }
.ns-vide h3 { font-family: var(--titre); font-weight: 400; font-size: 1.8rem; color: #04123f; margin: 0 0 6px; letter-spacing: 1px; }
.ns-nav-mois { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.ns-nav-mois h2 { font-family: var(--titre); font-weight: 400; font-size: 2rem; color: #04123f; margin: 0; letter-spacing: 1px; text-transform: capitalize; min-width: 230px; }
.ns-grille { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); background: #fff; border-radius: 16px; overflow: hidden; }
.ns-jour { background: #04123f; color: #fec40b; text-align: center; padding: 9px; font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; }
.ns-case { min-height: 175px; border-right: 1px solid #ececec; border-top: 1px solid #ececec; padding: 6px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ns-case:nth-child(7n) { border-right: none; }
.ns-case.hors { background: #fafafa; }
.ns-case.hors .ns-num { opacity: .4; }
.ns-num { font-size: .8rem; font-weight: 700; color: #04123f; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; border-radius: 50%; }
.ns-case.auj .ns-num { background: #fec40b; }
.ns-puce { all: unset; box-sizing: border-box; cursor: pointer; display: flex; flex-direction: column; gap: 4px; padding: 7px 9px; border-radius: 9px; background: var(--mt-fond); color: #04123f; border-left: 4px solid var(--mt); transition: transform .1s; }
.ns-puce:hover { transform: translateY(-1px); }
.ns-puce-haut, .ns-puce-bas { display: flex; justify-content: space-between; align-items: center; gap: 4px; flex-wrap: wrap; }
.ns-puce-client { font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; color: var(--mt); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.ns-puce-titre { font-size: .8rem; font-weight: 700; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.ns-puce-format { font-size: .62rem; font-weight: 800; text-transform: uppercase; opacity: .65; }
.ns-puce .statut-montage { font-size: .6rem; padding: 2px 7px; background: #fff; }
.ns-prio.mini { font-size: .58rem; padding: 2px 6px; }
.ns-fenetre { border-top: 6px solid #fec40b; }
.ns-fenetre .fenetre-tete h2 { color: #04123f; }
.ns-fiche h3 { font-family: var(--titre); font-weight: 400; font-size: 1.3rem; letter-spacing: 1px; color: #04123f; margin: 18px 0 8px; }
.ns-etapes { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.ns-etape { font-family: var(--corps); font-weight: 700; font-size: .84rem; border: 2px solid transparent; border-radius: 999px; padding: 7px 14px; cursor: pointer; background: var(--mt-fond); color: var(--mt); }
.ns-etape.choisi { border-color: var(--mt); box-shadow: 0 0 0 2px #fff inset; }
.ns-lien { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.ns-lien input { flex: 1 1 220px; font-family: var(--corps); font-size: .88rem; border: 1px solid #d9d9d9; border-radius: 10px; padding: 9px 11px; }

/* ===== Fiche de contenu façon Notion ===== */
.fenetre-fiche { width: min(820px, 100%); }
.fenetre-fiche .fenetre-tete h2 { font-family: var(--corps); font-size: .9rem; font-weight: 600; color: var(--texte-doux); text-transform: capitalize; letter-spacing: 0; }
.fenetre-fiche .fenetre-pied { display: none; }
.titre-editable { width: 100%; border: none; resize: none; overflow: hidden; font-family: var(--titre); font-size: 2.1rem; letter-spacing: 1px; color: var(--ardoise-fonce); background: transparent; padding: 4px 6px; border-radius: 8px; line-height: 1.15; }
.titre-editable:hover { background: var(--creme); }
.titre-editable:focus { outline: none; background: var(--creme); }
.props { display: flex; flex-direction: column; gap: 2px; margin: 10px 0 6px; }
.prop { display: grid; grid-template-columns: 130px 1fr; align-items: center; gap: 10px; min-height: 36px; }
.prop-label { font-size: .84rem; color: var(--texte-doux); padding-left: 6px; }
.prop-select, .prop-input { font-family: var(--corps); font-size: .88rem; color: var(--texte); border: 1px solid transparent; background: transparent; border-radius: 8px; padding: 6px 8px; cursor: pointer; max-width: 100%; }
.prop-input { width: 100%; cursor: text; }
.prop-select:hover, .prop-input:hover { background: var(--creme); }
.prop-select:focus, .prop-input:focus { outline: none; border-color: var(--creme-fonce); background: var(--blanc); }
.prop-select.etat, .prop-select.pastille-format { font-weight: 700; font-size: .8rem; border-radius: 999px; padding: 4px 12px; width: auto; }
.prop-select.pastille-format { border-left: 4px solid; border-radius: 8px; }
.brief-cliquable { cursor: text; transition: box-shadow .15s; }
.brief-cliquable:hover { box-shadow: 0 0 0 2px var(--creme-fonce); }
.brief-editable { width: 100%; min-height: 200px; font-family: var(--corps); font-size: .9rem; line-height: 1.6; color: var(--texte); border: 2px solid var(--caramel); border-radius: 12px; padding: 14px 16px; background: var(--blanc); resize: vertical; }
.brief-editable:focus { outline: none; }
.stats-fiche { margin-top: 18px; }
.stats-fiche summary { cursor: pointer; font-weight: 700; color: var(--ardoise); font-size: .9rem; }
.fiche-pied { margin-top: 20px; padding-top: 12px; border-top: 1px solid var(--creme-fonce); }

/* ===== Accès aux comptes ===== */
.bloc-acces .carre-tete .doux { margin: 4px 0 0; font-size: .88rem; max-width: 560px; }
.liste-acces { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; margin-top: 8px; }
.acces { background: var(--creme); border-radius: 14px; padding: 14px; display: flex; flex-direction: column; gap: 8px; }
.acces-plateforme { display: flex; justify-content: space-between; align-items: center; }
.acces-plateforme b { color: var(--ardoise-fonce); font-size: 1rem; }
.acces-plateforme a { font-size: .8rem; color: var(--ardoise); }
.acces-champ { display: grid; grid-template-columns: 100px 1fr auto auto; gap: 6px; align-items: center; background: var(--blanc); border-radius: 10px; padding: 6px 8px; }
.acces-label { font-size: .74rem; color: var(--texte-doux); }
.acces-valeur { font-size: .88rem; font-weight: 600; overflow-wrap: anywhere; }
.acces-valeur.mdp { font-family: monospace; letter-spacing: 1px; }
.acces-notes { margin: 0; font-size: .82rem; color: var(--texte-doux); }
.acces-pied { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: .74rem; }
.note-securite { margin: 16px 0 0; font-size: .8rem; color: var(--texte-doux); }

/* ===== Page Business ===== */
.actions-finances { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.chiffres-cles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px; }
.chiffre-cle { background: var(--blanc); border-radius: 16px; padding: 16px 18px; box-shadow: 0 2px 10px rgba(85, 114, 125, .06); display: flex; flex-direction: column; }
.chiffre-cle .l { font-size: .8rem; color: var(--texte-doux); font-weight: 600; }
.chiffre-cle .n { font-family: var(--titre); font-size: 2.2rem; color: var(--ardoise-fonce); letter-spacing: .5px; line-height: 1.1; }
.grille-graphiques { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 12px; }
.grille-graphiques .graphique:first-child { grid-column: 1 / -1; }
.barres { display: grid; grid-template-columns: repeat(12, 1fr); gap: 6px; height: 220px; align-items: end; padding-top: 24px; border-bottom: 1px solid var(--creme-fonce); }
.barre-col { display: flex; flex-direction: column; height: 100%; outline: none; }
.barre-zone { position: relative; flex: 1; display: flex; align-items: flex-end; justify-content: center; }
.barre { width: 70%; max-width: 46px; background: var(--ardoise); border-radius: 4px 4px 0 0; min-height: 2px; transition: opacity .15s; }
.barre.courante { background: var(--ardoise-fonce); }
.barre-col:hover .barre, .barre-col:focus .barre { opacity: .8; }
.valeur-barre { position: absolute; left: 50%; transform: translateX(-50%); font-size: .72rem; font-weight: 700; color: var(--texte); white-space: nowrap; }
.repere-objectif { position: absolute; left: 8%; right: 8%; border-top: 2px dashed var(--texte-doux); z-index: 1; }
.infobulle { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); background: var(--ardoise-fonce); color: var(--creme); font-size: .76rem; padding: 6px 10px; border-radius: 8px; white-space: nowrap; pointer-events: none; opacity: 0; transition: opacity .12s; z-index: 2; }
.barre-col:hover .infobulle, .barre-col:focus .infobulle { opacity: 1; }
.barre-mois { text-align: center; font-size: .72rem; color: var(--texte-doux); padding-top: 6px; text-transform: capitalize; font-family: var(--petit); }
.legende-graph { display: flex; align-items: center; gap: 8px; font-size: .78rem; color: var(--texte-doux); margin: 10px 0 0; }
.trait-objectif { width: 22px; border-top: 2px dashed var(--texte-doux); }
.table-chiffres { width: 100%; border-collapse: collapse; font-size: .88rem; }
.table-chiffres th, .table-chiffres td { text-align: left; padding: 7px 8px; border-bottom: 1px solid var(--creme); }
.table-chiffres th { font-size: .74rem; text-transform: uppercase; letter-spacing: .5px; color: var(--texte-doux); }
.slogan { font-family: var(--titre); font-size: 1.6rem; letter-spacing: 1px; color: var(--ardoise); margin: 0 0 18px; }
.grille-offres { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; align-items: start; margin-bottom: 18px; }
.offre { border-top: 6px solid var(--creme-fonce); display: flex; flex-direction: column; gap: 4px; }
.offre-0 { border-top-color: #e3cdb4; }
.offre-1 { border-top-color: var(--caramel); }
.offre-2 { border-top-color: var(--ardoise); }
.offre-tete { display: flex; flex-direction: column; margin-bottom: 6px; }
.offre-tete h2 { margin: 0; }
.offre-prix { font-family: var(--titre); font-size: 2.6rem; color: var(--ardoise-fonce); line-height: 1; letter-spacing: .5px; }
.offre-accroche { font-style: italic; color: var(--caramel); font-weight: 600; margin: 4px 0; }
.offre p { font-size: .88rem; margin: 4px 0; }
.offre-phrase { background: var(--creme); border-radius: 10px; padding: 10px 12px; }
.liste-oui, .liste-non { margin: 0; padding: 0; list-style: none; font-size: .86rem; display: flex; flex-direction: column; gap: 5px; }
.liste-oui li::before { content: '✓ '; color: #4c7351; font-weight: 800; }
.liste-non li { color: var(--texte-doux); }
.liste-non li::before { content: '✕ '; color: #a35d4f; font-weight: 800; }
.offre-argument { margin: 10px 0; font-size: .86rem; }
.offre-argument summary { cursor: pointer; font-weight: 700; color: var(--ardoise); }
.offre .btn { align-self: flex-start; margin-top: 6px; }
.table-options { display: flex; flex-direction: column; }
.table-options div { display: flex; justify-content: space-between; padding: 9px 4px; border-bottom: 1px solid var(--creme); font-size: .9rem; }
.avatar-intro { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; }
.avatar-intro h2 { margin: 0; }
.avatar-intro .doux { margin: 2px 0 0; }
.avatar-initiale { width: 64px; height: 64px; border-radius: 50%; background: var(--caramel); color: var(--blanc); font-family: var(--titre); font-size: 2.2rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.grille-avatar { columns: 2; column-gap: 18px; }
.bloc-avatar { break-inside: avoid; margin-bottom: 18px; }
.texte-avatar { white-space: pre-wrap; font-size: .9rem; line-height: 1.6; cursor: text; border-radius: 10px; padding: 6px; margin: -6px; }
.texte-avatar:hover { background: var(--creme); }

/* ===== Aperçu de l'espace client ===== */
.barre-retour { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.barre-retour .retour { margin: 0; }
body.mode-client .sidebar { display: none; }
body.mode-client .page { padding-top: 0; }
body.mode-client .ajout-jour { display: none; }
.ap-bandeau { color: #f0eee5 !important; position: sticky; top: 0; z-index: 20; display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; background: #2f3e44; color: var(--creme); padding: 10px 20px; margin: 0 -40px 0; font-size: .86rem; }
.ap-bandeau a { color: #c8a47b; font-weight: 700; text-decoration: none; }
.ap-page { padding-top: 22px; }
.ap-haut { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; }
.ap-marque { font-family: var(--titre); font-size: 1.9rem; letter-spacing: 2px; color: var(--ardoise); line-height: 1; }
.ap-marque small { font-family: var(--corps); font-size: .68rem; letter-spacing: 3px; text-transform: uppercase; color: var(--caramel); margin-left: 4px; }
.ap-connecte { font-size: .82rem; color: var(--texte-doux); background: var(--blanc); border-radius: 999px; padding: 6px 14px; }
.ap-bienvenue { margin-bottom: 22px; border-left: 5px solid var(--caramel); }
.ap-bienvenue h2 { margin-top: 0; }
.ap-bienvenue p { margin: 0; color: var(--texte-doux); line-height: 1.6; }
.ap-contact { display: flex; flex-direction: column; gap: 10px; }
.ap-contact .doux { margin: 0 0 4px; }
.ap-whatsapp { background: #25d366; color: #fff; justify-content: center; text-decoration: none; }
.ap-whatsapp:hover { background: #1fb457; }
.ap-contact .secondaire { justify-content: center; text-decoration: none; }
.ap-actions { margin: 0; padding-left: 18px; }
.ap-actions li { margin-bottom: 8px; }
.ap-actions li.fait { color: var(--texte-doux); text-decoration: line-through; }
.ap-video { border-left: 4px solid #b8890a; }
.contact-lecture { cursor: default; }

/* ===== Téléphone : le menu passe en bas de l'écran ===== */
@media (max-width: 900px) {
  .carres-todo { grid-template-columns: 1fr; }
  .grille-client { grid-template-columns: 1fr; }
  .grille-tableau { grid-template-columns: 1fr; }
  .grille-graphiques { grid-template-columns: 1fr; }
  .grille-avatar { columns: 1; }
}

@media (max-width: 760px) {
  .app { flex-direction: column; }
  /* Téléphone : barre fine en haut + menu « trois traits » qui se déroule */
  .sidebar {
    position: sticky; top: 0; left: 0; right: 0; z-index: 30;
    width: 100%; height: auto; max-height: 100vh; overflow-y: auto;
    padding: calc(10px + env(safe-area-inset-top)) 16px 10px;
    gap: 0;
    box-shadow: 0 4px 20px rgba(0, 0, 0, .1);
  }
  .barre-haut { display: flex; align-items: center; justify-content: space-between; }
  .brand { flex-direction: row; align-items: baseline; gap: 8px; padding: 0; }
  .brand-mark { font-size: 1.9rem; }
  .brand-sub { margin-top: 0; font-size: .62rem; }
  .bouton-menu { display: flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; padding: 10px; border: none; background: rgba(240, 238, 229, .12); border-radius: 12px; cursor: pointer; }
  .bouton-menu span { display: block; height: 2px; background: var(--creme); border-radius: 2px; transition: transform .25s, opacity .2s; }
  .sidebar.ouvert .bouton-menu span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .sidebar.ouvert .bouton-menu span:nth-child(2) { opacity: 0; }
  .sidebar.ouvert .bouton-menu span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .nav, .sidebar-foot { display: none; }
  .sidebar.ouvert .nav { display: flex; flex-direction: column; gap: 4px; margin-top: 14px; animation: apparition .2s ease; }
  .sidebar.ouvert .sidebar-foot { display: flex; margin-top: 16px; padding: 14px 0 6px; border-top: 1px solid rgba(240, 238, 229, .15); }
  .nav a { padding: 13px 14px; font-size: 1rem; }
  .page { padding: 24px 16px 40px; }
  .entete h1 { font-size: 2.4rem; }
  .grille { grid-template-columns: 1fr; gap: 16px; }
  .pipeline { flex-wrap: wrap; }
  .seg { flex: 1 1 28% !important; min-height: 64px; }
  .filtres-barre { grid-template-columns: 1fr; }
  .prospect-ligne { grid-template-columns: 1fr; }
  .prospect-quand { grid-row: auto; }
  .champs { grid-template-columns: 1fr; }
  .ajout-tache { flex-wrap: wrap; }
  .carres-todo { grid-template-columns: 1fr; }
  .ajout-tache input[name=titre] { flex-basis: 100%; }
  .toast { bottom: calc(24px + env(safe-area-inset-bottom)); }
  .banniere-contenu { padding: 20px; gap: 14px; }
  .banniere-logo, .initiales.grand { width: 76px; height: 76px; border-radius: 18px; }
  .banniere-contenu h1 { font-size: 2.2rem; }
  .compte-a-rebours { margin-left: 0; }
  .chiffres-calendrier { grid-template-columns: repeat(2, 1fr); }
  .post { grid-template-columns: 56px minmax(0, 1fr); }
  .post .etat { grid-column: 2; justify-self: start; }
  .contact { grid-template-columns: 1fr; gap: 2px; }
    .ns-compteurs { grid-template-columns: repeat(2, 1fr); }
  .ns-liste { grid-template-columns: 1fr; }
  .ns-case { min-height: 60px; }
  .ns-app { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .ns-menu { position: static; height: auto; gap: 12px; padding: 16px; }
  .ns-nav { flex-direction: row; flex-wrap: wrap; }
  .ns-nav-titre { display: none; }
  .ns-retour { margin-top: 4px; }
  .ns-contenu { padding: 20px 16px 40px; }
  .ns-titre { font-size: 2.1rem; }
  .ns-compteurs { grid-template-columns: repeat(3, 1fr); }
  .ns-nav-mois h2 { min-width: 0; font-size: 1.5rem; }
  .ns-jour { padding: 8px 2px; font-size: .62rem; letter-spacing: 0; }
  .ap-bandeau { margin: 0 -16px; padding: 10px 16px; }
  .ap-haut { flex-direction: column; align-items: flex-start; gap: 8px; }
  .ns-puce { padding: 0; height: 7px; border-left: none; background: var(--mt); }
  .ns-puce > * { display: none !important; }
  .case-jour { min-height: 70px; padding: 3px; }
  .puce-post { padding: 0; height: 7px; border-radius: 4px; border-left: none; }
  .puce-haut, .puce-titre, .puce-etat { display: none; }
  .nom-jour { padding: 8px 2px; font-size: .66rem; letter-spacing: 0; }
  .nav-mois h2 { min-width: 0; font-size: 1.6rem; }
}

/* ----- Notifications : la cloche et sa liste déroulante ----- */
.barre-haut { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.barre-haut .cloche { margin-left: auto; }
@media (max-width: 760px) { .barre-haut { align-items: center; } .barre-haut .cloche { width: 44px; height: 44px; } }
.cloche { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; flex-shrink: 0; border: none; border-radius: 12px; background: rgba(240, 238, 229, .12); color: var(--creme); cursor: pointer; transition: background .15s; }
.cloche:hover { background: rgba(240, 238, 229, .22); }
.cloche .pastille { position: absolute; top: -5px; right: -5px; display: inline-flex; align-items: center; justify-content: center; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 999px; background: #b8725f; color: #fff; font-family: var(--petit); font-size: .7rem; font-weight: 700; line-height: 1; box-shadow: 0 0 0 2px var(--ardoise); animation: pastille-arrive .3s ease-out; }
@keyframes pastille-arrive { from { transform: scale(.4); opacity: 0; } to { transform: none; opacity: 1; } }
.ns-marque { position: relative; }
.ns-marque .cloche { position: absolute; top: 0; right: 0; color: #f3f3f3; background: rgba(243, 243, 243, .1); }
.ns-marque .cloche .pastille { background: #fec40b; color: #04123f; box-shadow: 0 0 0 2px #04123f; }
body.mode-client .cloche, body.mode-client .cloche-liste { display: none; }

.cloche-liste { position: fixed; left: 12px; right: 12px; z-index: 60; max-height: min(70vh, 520px); overflow-y: auto; background: var(--blanc); color: var(--texte); border-radius: 16px; box-shadow: 0 14px 40px rgba(47, 62, 68, .22); padding: 8px; animation: apparition .18s ease-out; }
@media (min-width: 761px) { .cloche-liste { right: auto; width: 360px; } }
.cloche-tete { display: flex; align-items: center; justify-content: space-between; padding: 8px 10px 10px; font-size: .95rem; }
.cloche-tout { border: none; background: none; color: var(--ardoise); font-family: var(--corps); font-size: .78rem; font-weight: 600; text-decoration: underline; cursor: pointer; padding: 0; }
.cloche-vide { margin: 4px 10px 12px; color: var(--texte-doux); font-size: .9rem; }
.notif { display: flex; align-items: flex-start; gap: 4px; border-radius: 12px; transition: background .15s; }
.notif:hover { background: var(--creme); }
.notif + .notif { margin-top: 2px; }
.notif-corps { all: unset; box-sizing: border-box; flex: 1; min-width: 0; cursor: pointer; display: flex; flex-direction: column; gap: 2px; padding: 10px; }
.notif-qui { display: flex; gap: 4px; font-size: .78rem; color: var(--texte-doux); }
.notif-qui b { color: var(--ardoise-fonce); }
.notif-quand { margin-left: auto; white-space: nowrap; font-family: var(--petit); font-size: .72rem; }
.notif-titre { font-weight: 600; font-size: .9rem; }
.notif-nb { display: inline-block; margin-left: 4px; padding: 0 7px; border-radius: 999px; background: #fbf1ee; color: #a35d4f; font-size: .7rem; font-weight: 700; vertical-align: 1px; }
.notif-texte { font-size: .84rem; color: var(--texte); overflow-wrap: anywhere; }
.notif-effacer { flex-shrink: 0; width: 30px; height: 30px; margin: 8px 6px 0 0; border: none; border-radius: 50%; background: none; color: var(--texte-doux); font-size: .85rem; cursor: pointer; }
.notif-effacer:hover { background: var(--creme-fonce); color: var(--texte); }

/* ----- Relecture vidéo (façon Frame.io) ----- */
.depot-video { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 12px; }
.depot-bouton { cursor: pointer; }
.depot-bouton.envoi { opacity: .75; pointer-events: none; animation: respire 1s ease-in-out infinite alternate; }
.revue { margin: 4px 0 12px; }
.revue-video { max-height: 520px; }
.revue-temps { position: relative; height: 18px; margin: 8px 6px 0; border-radius: 999px; background: rgba(4, 18, 63, .08); }
.revue:not(.prete) .revue-repere { display: none; }
.revue-repere { position: absolute; top: 50%; width: 14px; height: 14px; padding: 0; border: 2px solid #fff; border-radius: 50%; transform: translate(-50%, -50%); cursor: pointer; box-shadow: 0 1px 4px rgba(0, 0, 0, .25); transition: transform .12s; }
.revue-repere:hover { transform: translate(-50%, -50%) scale(1.3); }
.repere-monteur { background: #04123f; }
.repere-client { background: #b8725f; }
.repere-eloise { background: var(--caramel); }
.revue-infos { margin: 6px 0 0; font-size: .74rem; color: var(--texte-doux); font-family: var(--petit); }
.tc-choix { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 10px; background: #fec40b26; color: #04123f; font-size: .82rem; cursor: pointer; white-space: nowrap; }
.tc-choix input { margin: 0; accent-color: #04123f; }
.tc-lien { display: inline-block; margin-right: 6px; padding: 1px 7px; border: none; border-radius: 6px; background: #fec40b; color: #04123f; font-family: var(--petit); font-size: .72rem; font-weight: 700; cursor: pointer; vertical-align: 1px; }
.tc-lien.ancien { background: rgba(0, 0, 0, .08); color: inherit; opacity: .7; cursor: default; }
.autre-lien { margin: 6px 0 14px; font-size: .84rem; }
.autre-lien summary { cursor: pointer; color: var(--texte-doux); margin-bottom: 8px; }
.notif-tc { color: #04123f; background: #fec40b; border-radius: 5px; padding: 0 5px; font-size: .74rem; }
.revue-cadre { position: relative; }
.revue-attente { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 20px; border-radius: 12px; background: #04123f; color: #f3f3f3; font-size: .9rem; font-weight: 600; text-align: center; }
.revue.prete .revue-attente { display: none; }
.revue-barre { width: min(240px, 80%); height: 6px; border-radius: 999px; background: rgba(243, 243, 243, .2); overflow: hidden; }
.revue-barre span { display: block; width: 0; height: 100%; border-radius: inherit; background: #fec40b; transition: width .3s; }
.bulle-tc { cursor: pointer; transition: transform .12s, box-shadow .12s; }
.bulle-tc:hover { transform: translateY(-1px); box-shadow: 0 3px 10px rgba(0, 0, 0, .12); }
.bulle-active { animation: bulle-eclat 1.2s ease-out; }
@keyframes bulle-eclat { 0% { box-shadow: 0 0 0 0 #fec40bcc; } 100% { box-shadow: 0 0 0 10px #fec40b00; } }
.revue-telecharger { margin-top: 8px; }
body.mode-client .revue-telecharger { display: none; }
.ns-btn.lien-danger { background: transparent; color: #a35d4f; border: 1px solid #e6c9c1; }
.ns-btn.lien-danger:hover { background: #fbf1ee; }

/* ----- Onglet « Mon événement » (rempli par le client et par Éloïse) ----- */
.bloc-evenement { display: flex; flex-direction: column; gap: 6px; }
.ev-tete { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 6px; }
.ev-tete h2 { margin-bottom: 4px; }
.ev-tete p { margin: 0; max-width: 560px; }
.ev-progression { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; min-width: 130px; }
.ev-progression strong { font-family: var(--titre); font-weight: 400; font-size: 1.8rem; color: var(--ardoise); line-height: 1; }
.ev-progression span { font-size: .75rem; color: var(--texte-doux); }
.ev-progression .barre-avancement { width: 130px; margin-top: 4px; }
.ev-rubrique { padding-top: 14px; border-top: 1px solid var(--creme-fonce); margin-top: 10px; }
.ev-rubrique h3 { margin: 0 0 10px; font-family: var(--titre); font-weight: 400; font-size: 1.25rem; letter-spacing: .5px; color: var(--ardoise); }
.ev-grille { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; }
.ev-ligne { display: flex; flex-direction: column; gap: 4px; }
.ev-ligne.large { grid-column: 1 / -1; }
.ev-ligne > span { font-size: .78rem; font-weight: 600; color: var(--texte-doux); }
.ev-champ { width: 100%; font-family: var(--corps); font-size: .92rem; color: var(--texte); background: var(--creme); border: 1px solid transparent; border-radius: 10px; padding: 9px 12px; resize: none; transition: border-color .15s, background .15s; }
.ev-champ:hover { border-color: var(--creme-fonce); }
.ev-champ:focus { outline: none; background: var(--blanc); border-color: var(--ardoise); }
.ev-champ::placeholder { color: var(--texte-doux); opacity: .65; }
.ev-signature { margin: 12px 0 0; }
.ev-lien { display: block; margin: 4px 0 12px; text-align: left; }
@media (max-width: 760px) { .ev-grille { grid-template-columns: 1fr; } .ev-progression { align-items: flex-start; } }

/* ----- Couleurs de l'événement (formulaire client) ----- */
.choix-couleurs { gap: 10px; }
.case-couleurs { display: flex; align-items: center; gap: 8px; font-size: .88rem; font-weight: 500; color: var(--texte); cursor: pointer; }
.couleurs-zone { display: grid; grid-template-columns: minmax(0, 1fr) 230px; gap: 16px; align-items: start; transition: opacity .2s; }
.couleurs-zone.eteint { opacity: .35; pointer-events: none; }
.pastilles-couleurs { display: flex; flex-direction: column; gap: 10px; }
.pastille-couleur { display: grid; grid-template-columns: 46px minmax(0, 1fr) 92px; align-items: center; gap: 10px; }
.pastille-couleur input[type=color] { width: 46px; height: 46px; padding: 0; border: 2px solid var(--blanc); border-radius: 50%; box-shadow: 0 0 0 1px var(--creme-fonce); cursor: pointer; background: none; }
.pastille-couleur input[type=color]::-webkit-color-swatch-wrapper { padding: 0; }
.pastille-couleur input[type=color]::-webkit-color-swatch { border: none; border-radius: 50%; }
.pastille-couleur input[type=color]::-moz-color-swatch { border: none; border-radius: 50%; }
.pc-nom { display: flex; flex-direction: column; font-size: .88rem; font-weight: 600; color: var(--texte); }
.pc-nom small { font-weight: 400; font-size: .74rem; color: var(--texte-doux); }
.pc-hex { font-family: var(--petit) !important; font-size: .82rem !important; text-transform: lowercase; padding: 7px 9px !important; }
.ac-page { border-radius: 14px; padding: 8px; box-shadow: var(--ombre); font-family: var(--corps); }
.ac-banniere { display: flex; flex-direction: column; justify-content: flex-end; height: 74px; padding: 10px 12px; border-radius: 10px; color: #fff; }
.ac-banniere small { font-size: .55rem; letter-spacing: 1.5px; text-transform: uppercase; opacity: .85; }
.ac-banniere b { font-family: var(--titre); font-weight: 400; font-size: 1.25rem; letter-spacing: .5px; line-height: 1.1; }
.ac-onglets { display: flex; gap: 10px; padding: 8px 4px 6px; font-size: .62rem; color: #888; }
.ac-onglets span:first-child { border-bottom: 2px solid; font-weight: 700; }
.ac-cartes { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.ac-carte { display: flex; flex-direction: column; gap: 6px; padding: 8px; border-radius: 8px; min-height: 52px; }
.ac-carte i { font-style: normal; font-family: var(--titre); font-size: .85rem; letter-spacing: .3px; }
.ac-barre { display: block; height: 5px; border-radius: 5px; overflow: hidden; }
.ac-barre span { display: block; width: 60%; height: 100%; }
.ac-bouton { align-self: flex-start; padding: 3px 9px; border-radius: 999px; color: #fff; font-size: .6rem; font-weight: 700; }
@media (max-width: 760px) { .couleurs-zone { grid-template-columns: 1fr; } }
.champs .case-couleurs input { width: auto; flex-shrink: 0; margin: 0; accent-color: var(--ardoise); }
.ev-label { display: flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 600; color: var(--texte-doux); }
.ev-retirer { margin-left: auto; width: 22px; height: 22px; padding: 0; border: none; border-radius: 50%; background: none; color: var(--texte-doux); font-size: .7rem; cursor: pointer; opacity: .45; transition: opacity .15s, background .15s; }
.ev-ligne:hover .ev-retirer, .ev-retirer:focus { opacity: 1; }
.ev-retirer:hover { background: #fbf1ee; color: #a35d4f; }
@media (hover: none) { .ev-retirer { opacity: .8; } }
.ev-ajouter { margin-top: 14px; }
.ev-ajouter select { font-family: var(--corps); font-size: .88rem; border: 1px dashed var(--ardoise); border-radius: 10px; padding: 8px 12px; background: var(--blanc); color: var(--ardoise); cursor: pointer; }
.ev-lecture { display: grid; grid-template-columns: minmax(140px, 220px) minmax(0, 1fr); gap: 8px 18px; margin: 0; }
.ev-lecture dt { font-size: .8rem; font-weight: 600; color: var(--texte-doux); }
.ev-lecture dd { margin: 0; font-size: .92rem; overflow-wrap: anywhere; }
@media (max-width: 760px) { .ev-lecture { grid-template-columns: 1fr; gap: 2px; } .ev-lecture dd { margin-bottom: 10px; } }
.acces-a-remplir { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.acces-vide { flex: 1 1 160px; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 14px 16px; border: 1.5px dashed var(--caramel); border-radius: 14px; background: var(--caramel-clair); color: var(--texte); font-family: var(--corps); cursor: pointer; text-align: left; transition: transform .12s; }
.acces-vide:hover { transform: translateY(-1px); }
.acces-vide b { font-size: .95rem; }
.acces-vide span { font-size: .8rem; color: var(--ardoise); font-weight: 600; }

/* ----- Logo et photo de couverture (bandeau de la fiche client) ----- */
.banniere-client { position: relative; }
.banniere-boutons { position: absolute; top: 14px; right: 14px; z-index: 2; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.banniere-bouton { background: rgba(255, 255, 255, .88); color: var(--ardoise-fonce); border: none; cursor: pointer; backdrop-filter: blur(4px); }
.banniere-bouton:hover { background: #fff; }
.banniere-bouton.envoi { pointer-events: none; opacity: .8; }
.banniere-client.en-cadrage { cursor: grab; touch-action: none; outline: 3px dashed rgba(255, 255, 255, .8); outline-offset: -8px; }
.banniere-client.en-cadrage:active { cursor: grabbing; }
.en-cadrage .banniere-contenu, .en-cadrage .banniere-boutons { opacity: .25; pointer-events: none; }
.en-cadrage .banniere-voile { opacity: .3; }
.cadrage-barre { position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 3; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; padding: 8px 10px 8px 14px; border-radius: 999px; background: rgba(255, 255, 255, .94); box-shadow: var(--ombre); font-size: .82rem; font-weight: 600; color: var(--ardoise-fonce); max-width: calc(100% - 24px); }

/* ----- Onglet « Sponsoring » ----- */
.bloc-sponsoring .tuiles-argent { margin-bottom: 16px; }
.sp-boutons { display: flex; flex-wrap: wrap; gap: 8px; }
.sp-filtres { margin: 6px 0 14px; }
.sp-filtres .filtre span { opacity: .65; font-size: .78rem; margin-left: 2px; }
.sp-liste { display: flex; flex-direction: column; gap: 8px; }
.sp-ligne { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto; gap: 8px 16px; align-items: center; padding: 12px 14px; border-radius: 14px; background: var(--creme); border-left: 4px solid var(--sp, var(--creme-fonce)); }
.sp-principal { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.sp-nom { font-size: .98rem; }
.sp-contact, .sp-notes { font-size: .8rem; color: var(--texte-doux); overflow-wrap: anywhere; }
.sp-notes { font-style: italic; }
.sp-infos { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: .86rem; }
.sp-pack { padding: 2px 10px; border-radius: 999px; background: var(--blanc); font-weight: 700; font-size: .76rem; color: var(--ardoise-fonce); }
.sp-montant { font-weight: 700; }
.sp-montant small { font-weight: 500; color: var(--texte-doux); }
.sp-billets { display: inline-flex; align-items: center; gap: 5px; font-size: .8rem; cursor: pointer; }
.sp-actions { display: flex; gap: 6px; align-items: center; }
.sp-etape { font-family: var(--corps); font-size: .82rem; font-weight: 600; border: none; border-radius: 999px; padding: 6px 10px; background: var(--sp-fond, var(--blanc)); color: var(--sp-texte, var(--texte)); cursor: pointer; }
.sp-0 { --sp: #9aa5a8; --sp-fond: #eef0f0; --sp-texte: #55626a; }
.sp-1 { --sp: #6c8fb3; --sp-fond: #e7eef6; --sp-texte: #3d5f82; }
.sp-2 { --sp: #c8a47b; --sp-fond: #f3e9dc; --sp-texte: #7d5d36; }
.sp-3 { --sp: #4f9a73; --sp-fond: #e3f2ea; --sp-texte: #2f6b4c; }
.sp-4 { --sp: #2f6b4c; --sp-fond: #2f6b4c; --sp-texte: #fff; }
.sp-5 { --sp: #b8725f; --sp-fond: #fbf1ee; --sp-texte: #a35d4f; opacity: .75; }
.sp-packs { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.sp-pack-ligne { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
.sp-pack-ligne input { font-family: var(--corps); font-size: .9rem; border: 1px solid var(--creme-fonce); border-radius: 10px; padding: 8px 10px; width: 100%; }
.case-option { flex-direction: row !important; align-items: flex-start; gap: 10px !important; cursor: pointer; }
.champs .case-option input { width: auto; margin-top: 3px; accent-color: var(--ardoise); }
.case-option > span { font-size: .88rem !important; color: var(--texte) !important; font-weight: 400 !important; }
@media (max-width: 760px) { .sp-ligne { grid-template-columns: 1fr; } .sp-actions { justify-content: space-between; } }

/* ----- Formulaires Tally reçus ----- */
.fo-ligne { width: 100%; border: none; background: none; font: inherit; text-align: left; cursor: pointer; }
.fo-ligne:hover { background: var(--creme); }
.fo-ligne .mini-titre small { display: block; font-weight: 400; font-size: .75rem; color: var(--texte-doux); }
.fo-traite { opacity: .55; }
.fo-reponses { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; margin: 12px 0 18px; }
.fo-reponses dt { font-size: .78rem; font-weight: 600; color: var(--texte-doux); margin-top: 10px; }
.fo-reponses dd { margin: 0; font-size: .92rem; overflow-wrap: anywhere; }
.fo-boutons { display: flex; flex-wrap: wrap; gap: 8px; }
.badge-retro { display: inline-block; align-self: flex-start; margin-top: 4px; padding: 2px 9px; border-radius: 999px; background: #fec40b33; color: #6b5300; font-size: .74rem; font-weight: 600; }
.fo-ligne .mini-titre .badge-retro { display: table; }
.fo-retro { margin: 10px 0 4px; padding: 12px 14px; border-radius: 12px; background: #fec40b26; border-left: 4px solid #fec40b; font-size: .9rem; }

/* ----- Business › Calculateur ----- */
.calc-phrase { font-size: 1.02rem; line-height: 1.6; color: var(--ardoise-fonce); border-left: 5px solid var(--caramel); margin-bottom: 18px; }
.calc-grille { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.calc-entonnoir-carte { grid-row: span 2; }
.calc-entonnoir { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 8px 0 14px; }
.calc-etage { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.calc-etage-forme { width: var(--largeur); display: flex; align-items: baseline; justify-content: center; gap: 10px; padding: 12px 10px; border-radius: 14px; background: var(--ardoise); color: var(--creme); clip-path: polygon(0 0, 100% 0, 96% 100%, 4% 100%); }
.calc-etage:nth-child(2) .calc-etage-forme { background: var(--ardoise-fonce); }
.calc-etage:nth-child(3) .calc-etage-forme { background: var(--caramel); color: #3d2c17; }
.calc-etage:nth-child(4) .calc-etage-forme { background: #a9825a; color: #fff; }
.calc-etage .calc-n { font-family: var(--titre); font-size: 2.2rem; line-height: 1; letter-spacing: .5px; }
.calc-etage .calc-l { font-size: .85rem; font-weight: 600; }
.calc-suivi { width: var(--largeur); min-width: 210px; }
.calc-suivi-tete { display: flex; justify-content: space-between; font-size: .76rem; color: var(--texte-doux); margin-bottom: 3px; }
.calc-objectif { display: flex; flex-direction: column; gap: 6px; font-size: .85rem; font-weight: 600; color: var(--texte-doux); }
.calc-euros { display: inline-flex; align-items: center; gap: 6px; font-family: var(--titre); font-size: 1.6rem; color: var(--ardoise); }
.calc-euros input { width: 150px; font-family: var(--titre); font-size: 1.8rem; color: var(--ardoise-fonce); border: 1px solid var(--creme-fonce); border-radius: 12px; padding: 4px 12px; background: var(--creme); }
.calc-euros.petit, .calc-euros.petit input { font-size: 1.15rem; }
.calc-euros.petit input { width: 92px; padding: 3px 8px; }
.calc-prevu { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; margin: 12px 0 0; font-size: .88rem; }
.calc-prevu dt { color: var(--texte-doux); }
.calc-prevu dd { margin: 0; text-align: right; font-weight: 600; }
.calc-prevu .calc-total { padding-top: 8px; border-top: 1px solid var(--creme-fonce); color: var(--ardoise-fonce); font-weight: 700; font-size: 1rem; }
.calc-packs { display: flex; flex-direction: column; gap: 10px; }
.calc-pack { display: grid; grid-template-columns: minmax(0, 1.1fr) auto; gap: 4px 10px; align-items: center; padding: 10px 12px; border-radius: 12px; background: var(--creme); }
.calc-paiement { font-size: .8rem; color: var(--texte-doux); }
.calc-paiement select { font-family: var(--corps); font-size: .8rem; border: 1px solid var(--creme-fonce); border-radius: 8px; padding: 3px 6px; background: var(--blanc); }
.calc-champ-pct { display: inline-flex; align-items: center; gap: 4px; font-size: .8rem; color: var(--texte-doux); justify-self: end; }
.calc-champ-pct input { width: 62px; font-family: var(--corps); font-size: .95rem; font-weight: 700; color: var(--ardoise-fonce); border: 1px solid var(--creme-fonce); border-radius: 8px; padding: 4px 6px; text-align: right; background: var(--blanc); }
.calc-moyennes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.calc-moyennes div { display: flex; flex-direction: column; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--creme-fonce); }
.calc-moyennes .calc-n { font-family: var(--titre); font-size: 1.6rem; color: var(--ardoise); }
.calc-moyennes .calc-l { font-size: .76rem; color: var(--texte-doux); }
.calc-alerte { margin: 10px 0 0; font-size: .82rem; color: #a35d4f; }
.calc-taux { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--creme); }
.calc-taux b { display: block; font-size: .92rem; }
.calc-taux small { font-size: .76rem; color: var(--texte-doux); }
.calc-vrai { grid-column: 1 / -1; font-size: .8rem; color: var(--texte-doux); }
.calc-vrai strong { color: var(--ardoise-fonce); }
.encart-prospection { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin-bottom: 18px; padding: 14px 18px; text-decoration: none; color: var(--texte); }
.encart-titre { font-family: var(--titre); font-size: 1.15rem; letter-spacing: .5px; color: var(--ardoise); }
.encart-texte { font-size: .9rem; }
.encart-prospection .barre-avancement { flex: 1 1 140px; }
@media (max-width: 900px) { .calc-grille { grid-template-columns: 1fr; } .calc-entonnoir-carte { grid-row: auto; } }

/* ----- Mots de passe ----- */
.compte-mdp { display: block; margin-top: 3px; font-size: .76rem; color: #8a6d3b; }
.compte-mdp.choisi { color: #2f6b4c; }
#form-mdp .lien { align-self: center; margin-top: 4px; }
.ns-retour.ns-mdp { margin-bottom: 6px; font-size: .8rem; opacity: .85; }

/* ----- Menu déroulant « Espace d'Éloïse » (bas du menu) ----- */
.menu-compte { display: flex; flex-direction: column; gap: 8px; }
.menu-compte-liste { display: flex; flex-direction: column; gap: 6px; padding: 8px; border-radius: 14px; background: rgba(0, 0, 0, .12); animation: apparition .15s ease-out; }
.menu-compte-liste[hidden] { display: none; }
.menu-compte-bouton { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; padding: 10px 12px; border: 1px solid rgba(240, 238, 229, .25); border-radius: 12px; background: transparent; color: var(--creme); font-family: var(--corps); font-weight: 600; font-size: .85rem; cursor: pointer; }
.menu-compte-bouton:hover { background: rgba(240, 238, 229, .1); }
.menu-compte-bouton .fleche { transition: transform .2s; opacity: 1; }
.menu-compte-bouton[aria-expanded="true"] .fleche { transform: rotate(180deg); }
.sidebar-foot .menu-compte-bouton .fleche { opacity: 1; font-size: 1rem; line-height: 1; }

/* ----- Modèles de messages de prospection ----- */
.modeles-moment { margin: 18px 0 8px; font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: var(--texte-doux); }
.modele-carte { display: block; width: 100%; text-align: left; background: var(--creme); border: 1.5px solid transparent; border-radius: 12px; padding: 12px 14px; margin-bottom: 8px; cursor: pointer; font: inherit; color: var(--texte); }
.modele-carte:hover { border-color: var(--caramel); }
.modele-carte small { display: block; margin-top: 6px; color: var(--texte-doux); font-size: .8rem; line-height: 1.45; }
.modele-carte.conseille { background: var(--blanc); border-color: var(--caramel); }
.tag-conseille { display: inline-block; white-space: nowrap; font-size: .7rem; font-weight: 700; border-radius: 999px; padding: 3px 10px; background: var(--caramel); color: var(--blanc); }
.alerte-douce { background: #fbf1e3; border-left: 3px solid var(--caramel); border-radius: 8px; padding: 10px 12px; font-size: .85rem; margin: 0 0 12px; }
#message-pret { line-height: 1.55; }
.panneau .details-boutons { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.prospect-details .carre-tete { align-items: center; margin-bottom: 8px; }
.prospect-details .carre-tete h3 { margin: 0; }

/* ----- Documents (Business › Documents + encart des tableaux de bord) ----- */
.documents-business { display: grid; gap: 22px; }
.docs-barre { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.docs-barre select { font: inherit; border: 1px solid var(--creme-fonce); border-radius: 999px; padding: 8px 14px; background: var(--blanc); color: var(--texte); }
.docs-barre .espace { flex: 1; }
.docs-colonnes { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; align-items: start; }
.lien-titre { color: inherit; text-decoration: none; }
.lien-titre:hover { text-decoration: underline; }
.liste-documents { display: grid; gap: 8px; }
.document { display: grid; grid-template-columns: 80px 1fr auto auto auto; gap: 12px; align-items: center; background: var(--creme); border-radius: 12px; padding: 10px 14px; }
.document-type { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--caramel); }
.document-nom b { display: block; font-size: .9rem; }
.document-nom small { display: block; color: var(--texte-doux); font-size: .78rem; }
.document-infos { font-size: .8rem; color: var(--texte-doux); white-space: nowrap; }
.document-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: flex-end; }
.documents-business .carre-tete .btn { white-space: nowrap; flex-shrink: 0; }
.documents-business a.btn, .encart-documents a.btn { text-decoration: none; }
.cache-client { color: var(--caramel) !important; font-style: italic; }
.puces-documents { display: flex; flex-wrap: wrap; gap: 8px; }
.puce-document { display: inline-flex; align-items: center; gap: 4px; background: var(--creme); border-radius: 999px; padding: 6px 8px 6px 14px; }
.puce-document a { color: var(--ardoise-fonce); font-weight: 600; font-size: .86rem; text-decoration: none; }
.puce-document a:hover { text-decoration: underline; }
.puce-bouton { border: 0; font: inherit; font-weight: 600; font-size: .86rem; color: var(--ardoise-fonce); padding: 7px 14px; cursor: pointer; }
.puce-bouton:hover { background: var(--creme-fonce); }
.mini-docs { display: grid; gap: 6px; margin-bottom: 10px; }
.mini-doc { display: grid; grid-template-columns: 1fr auto auto; gap: 8px; align-items: center; background: var(--creme); border-radius: 10px; padding: 8px 12px; font-size: .86rem; }
.mini-doc-nom small { display: block; font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--caramel); }
.mini-doc-actions { display: flex; gap: 4px; }
@media (max-width: 700px) {
  .document { grid-template-columns: 1fr auto; gap: 6px 10px; }
  .document-type { grid-column: 1 / -1; }
  .document-infos { grid-column: 1; }
  .document-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .docs-colonnes { grid-template-columns: 1fr; }
  .docs-barre .espace { display: none; }
  .mini-doc { grid-template-columns: 1fr auto; }
  .mini-doc-actions, .mini-doc > a { grid-column: 1 / -1; }
}

/* ----- Générateur de contrat : formulaire ----- */
form.fenetre.fenetre-large { max-width: 760px; }
.gen-titre { margin: 14px 0 0; font-size: .82rem; text-transform: uppercase; letter-spacing: .06em; color: var(--caramel); }
.large-texte { margin: 0 0 14px; }
.boutons-tete { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.etat-document { font: inherit; font-size: .78rem; border: 1px solid var(--creme-fonce); border-radius: 999px; padding: 4px 8px; background: var(--blanc); color: var(--texte); }

/* ----- Contrat et annexe mis en page (style des PDF MRC) ----- */
#zone-impression { display: none; }
.g-doc { --g-ardoise: #55727d; --g-terra: #c27b5a; --g-titre: #b4663f; --g-texte: #4a4a4a; font-family: 'Poppins', 'Raleway', sans-serif; font-weight: 300; color: var(--g-texte); font-size: 10.5pt; line-height: 1.55; background: #fff; }
.g-doc b { font-weight: 600; color: #333; }
.g-haut { display: flex; justify-content: space-between; padding: 0 14mm 4mm; font-size: 8.5pt; letter-spacing: .14em; color: #7d8a90; }
.g-haut span:last-child { letter-spacing: .02em; }
.g-bandeau { background: linear-gradient(135deg, #55727d, #445e68); color: #fff; padding: 9mm 14mm 8mm; }
.g-logo { font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 26pt; line-height: .9; letter-spacing: -.02em; }
.g-logo small { display: block; font-size: 4.5pt; font-weight: 600; letter-spacing: .12em; margin: 1px 0 0 22px; }
.g-surtitre { margin-top: 7mm; font-size: 8.5pt; letter-spacing: .3em; color: #d8b48f; }
.g-bandeau h1 { font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 19pt; margin: 2mm 0 0; color: #fff; letter-spacing: 0; text-transform: none; }
.g-accroche { margin: 2mm 0 0; font-style: italic; font-size: 10.5pt; opacity: .9; }
.g-corps { padding: 6mm 14mm 10mm; }
.g-parties { display: grid; grid-template-columns: 1fr 1fr; gap: 5mm; margin-bottom: 4mm; }
.g-parties > div { border: 1px solid #e3e3e3; border-radius: 4px; padding: 3mm 4mm; }
.g-parties h3, .g-doc h2 { font-family: 'Poppins', sans-serif; }
.g-parties h3 { margin: 0 0 1.5mm; font-size: 8pt; font-weight: 700; letter-spacing: .15em; color: #444; }
.g-parties p { margin: 0; font-size: 9.5pt; line-height: 1.7; }
.g-centre { text-align: center; }
.g-doux { color: #8a8a8a; }
.g-vide { display: inline-block; height: 1em; vertical-align: -2px; border-bottom: 1px solid #999; background: #fde3dc; }
.g-article { break-inside: avoid; margin-top: 5mm; }
.g-article h2 { display: flex; align-items: center; gap: 4mm; margin: 0 0 2mm; padding-bottom: 1.5mm; border-bottom: 1px solid #e6e6e6; font-size: 10.5pt; font-weight: 700; color: #333; letter-spacing: 0; text-transform: none; }
.g-article h2 span { background: var(--g-terra); color: #fff; font-size: 7.5pt; letter-spacing: .12em; padding: 1mm 4mm; border-radius: 2px; }
.g-article p { margin: 0 0 2mm; text-align: justify; }
.g-cases { display: flex; gap: 6mm; flex-wrap: wrap; }
.g-cases span { display: inline-flex; align-items: center; gap: 2mm; }
.g-cases i { width: 3.2mm; height: 3.2mm; border: 1px solid var(--g-terra); border-radius: 1px; background: #fde3dc; display: inline-block; position: relative; }
.g-cases i.coche { background: var(--g-terra); }
.g-cases i.coche::after { content: '✓'; position: absolute; inset: -1.2mm 0 0 .5mm; color: #fff; font-size: 8pt; font-style: normal; font-weight: 700; }
.g-encadre { background: #f3e6df; border-left: 3px solid #d9b08c; margin: 2mm 0; padding: 3mm 5mm 3mm 9mm; }
.g-encadre li { margin: 1mm 0; }
.g-encadre li::marker { color: var(--g-terra); }
.g-signatures { display: grid; grid-template-columns: 1fr 1fr; gap: 10mm; margin-top: 12mm; break-inside: avoid; font-size: 9pt; color: #777; }
.g-ligne { display: block; height: 16mm; border-bottom: 1px solid #555; margin-bottom: 2mm; }
.g-infos-mission { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4mm; margin-bottom: 5mm; font-size: 9.5pt; }
.g-infos-mission small { display: block; font-size: 9pt; color: #555; font-weight: 400; }
.g-infos-mission b { display: block; border-bottom: 1px solid #d0d0d0; padding: 1mm 0; min-height: 6mm; }
.g-pourqui { border-left: 3px solid #e2cbb6; padding: 1mm 0 1mm 5mm; color: #777; margin: 0 0 4mm; }
.g-rubrique { break-inside: avoid; margin-top: 5mm; }
.g-rubrique h2, .g-non h2, .g-demandes h2 { margin: 0 0 2mm; padding-bottom: 1.5mm; border-bottom: 1px solid #e6e6e6; font-size: 10pt; font-weight: 700; letter-spacing: .14em; color: var(--g-titre); text-transform: none; }
.g-rubrique ul, .g-non ul { list-style: none; margin: 0; padding: 0; }
.g-rubrique li { position: relative; padding-left: 5mm; margin: 1.5mm 0; }
.g-rubrique li::before { content: '✓'; position: absolute; left: 0; color: #888; font-size: 9pt; }
.g-rubrique li.g-note { color: #a3a3a3; font-size: 8.5pt; margin-top: -1mm; }
.g-rubrique li.g-note::before { content: ''; }
.g-non { break-inside: avoid; margin-top: 6mm; background: #f3e6df; border-left: 3px solid var(--g-terra); padding: 4mm 6mm; }
.g-non h2 { border: 0; font-size: 9pt; }
.g-non li { margin: 1.5mm 0; }
.g-non li::before { content: '— '; color: var(--g-terra); }
.g-demandes { break-inside: avoid; margin-top: 6mm; border: 1px dashed #c9c9c9; padding: 4mm 6mm; }
.g-demandes h2 { border: 0; font-size: 9pt; color: #55727d; }
.g-demandes p { font-size: 9pt; margin: 0 0 3mm; }
.g-demandes-texte { white-space: pre-wrap; background: #fdf1ec; border: 1px solid #ecc9bb; padding: 3mm 4mm; min-height: 12mm; }

@media print {
  @page { size: A4; margin: 10mm 0 12mm; }
  body.impression { background: #fff !important; }
  body.impression > *:not(#zone-impression) { display: none !important; }
  body.impression #zone-impression { display: block; }
  .g-doc { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
.mini-doc > a.btn { justify-self: start; }

/* ----- Contenu › Ma stratégie ----- */
.strat-intro { margin: 0 0 16px; }
.strat-grille { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 22px; align-items: start; }
.strat-large { grid-column: 1 / -1; }
.strat-zone { width: 100%; font-family: var(--corps); font-size: .9rem; line-height: 1.6; color: var(--texte); border: 1px solid transparent; border-radius: 10px; padding: 8px 10px; background: var(--creme); resize: vertical; }
.strat-zone:hover { border-color: var(--creme-fonce); }
.strat-zone:focus { outline: 2px solid var(--caramel); background: var(--blanc); }
.strat-chiffres { display: grid; gap: 8px; margin-bottom: 10px; font-size: .88rem; }
.strat-chiffres input, .strat-part input { width: 58px; font: inherit; font-weight: 700; text-align: center; border: 1px solid var(--creme-fonce); border-radius: 8px; padding: 5px; margin-right: 6px; background: var(--blanc); color: var(--texte); }
.strat-part { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start; padding: 10px 0; border-bottom: 1px solid var(--creme); }
.strat-part label { white-space: nowrap; font-weight: 600; }
.strat-part small { display: block; color: var(--texte-doux); font-size: .78rem; line-height: 1.4; margin-top: 2px; }
.strat-checklist { margin: 0 0 10px; padding-left: 22px; line-height: 1.7; }
.strat-checklist li::marker { color: var(--caramel); font-weight: 700; }
.strat-sous-titre { font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: var(--texte-doux); margin: 18px 0 10px; }
.strat-ligne { margin-bottom: 14px; }
.strat-ligne-tete { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: .88rem; margin-bottom: 6px; }
.strat-verdict { font-size: .78rem; font-weight: 600; border-radius: 999px; padding: 2px 10px; }
.strat-verdict.ok { background: #dfeadf; color: #4c7351; }
.strat-verdict.trop { background: #f4dfda; color: #a35d4f; }
.strat-verdict.manque { background: var(--caramel-clair); color: #9a7448; }
.strat-barre { position: relative; height: 10px; background: var(--creme); border-radius: 999px; }
.strat-barre span { display: block; height: 100%; background: var(--ardoise); border-radius: 999px; }
.strat-barre i { position: absolute; top: -4px; width: 2px; height: 18px; background: var(--caramel); }
.strat-semaines { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.strat-semaine { background: var(--creme); border-radius: 12px; padding: 10px 12px; display: grid; gap: 2px; font-size: .85rem; }
.strat-semaine.trop { background: #f4dfda; }
.strat-semaine small { font-weight: 400; color: var(--texte-doux); }
.strat-alerte { color: #a35d4f !important; font-size: .78rem; }
@media (max-width: 700px) {
  .strat-grille { grid-template-columns: 1fr; }
  .strat-semaines { grid-template-columns: 1fr 1fr; }
}

/* --- Glisser-déposer dans le calendrier --- */
[data-glisser] { cursor: grab; }
.en-glisse { opacity: .35; }
.fantome-glisse { position: fixed; top: 0; left: 0; z-index: 9999; pointer-events: none; opacity: .92; box-shadow: 0 10px 28px rgba(0, 0, 0, .18); rotate: 2deg; }
.glisse-en-cours, .glisse-en-cours * { cursor: grabbing; user-select: none; }
.survol-depot { outline: 2px dashed var(--caramel); outline-offset: -3px; background: rgba(200, 164, 123, .12); }
.banque-idees.survol-depot { border-radius: 16px; }

/* --- Connexion avec Google (étape 21) --- */
.bouton-google { all: unset; box-sizing: border-box; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; margin-top: 22px; padding: 13px 18px; border: 1px solid var(--creme-fonce); border-radius: 999px; background: var(--blanc); font-weight: 600; color: var(--texte); transition: background .15s; }
.bouton-google:hover { background: var(--creme); }
.info-connexion { margin: 16px 0 0; padding: 10px 14px; border-radius: 12px; background: #f4dfda; color: #7d4538; font-size: .9rem; }
.autre-connexion { margin-top: 22px; font-size: .9rem; }
.autre-connexion summary { cursor: pointer; color: var(--texte-doux); text-align: center; }
.autre-connexion .champs-connexion { margin-top: 14px; }

/* Boutons rapides de la ligne prospect (liens présentés comme des boutons) */
.prospect-actions a.btn { text-decoration: none; }
/* Cases email / Instagram / site / téléphone à remplir dans le détail d'un prospect */
.saisie-contact { display: flex; align-items: center; gap: 6px; }
.saisie-contact input { flex: 1; min-width: 0; padding: 4px 8px; border: 1px solid var(--ligne, #ddd8c8); border-radius: 8px; background: transparent; font: inherit; }
.saisie-contact input:placeholder-shown { border-style: dashed; }
.saisie-contact a { text-decoration: none; font-weight: 600; }